php怎么实现联想搜索-创新互联

联想搜索

成都创新互联专注骨干网络服务器租用10年，服务更有保障！服务器租用，温江服务器托管 成都服务器租用，成都服务器托管，骨干网络带宽，享受低延迟，高速访问。灵活、实现低成本的共享或公网数据中心高速带宽的专属高性能服务器。

1.联想功能需要数据库，

2.每字联想还要ajax传值，

但是那，在这里咱们不用ajax，因为ajax的速度问题，所以我采用调用jquery.

效果展示：

代码实现：

调用时先引进jquery才能实现

<meta charset="utf-8">
<input type="text"  value="" id="wd">
<div style='background: #e1e1e1;width:220px;display:none;' id="rs">
    <ul>
 
    </ul>
</div>
<script src="jq.js"></script>
<script>
    $(function(){
        $("#wd").keyup(function(){
            var word=$(this).val();
            $.ajax({
                url:'http://suggestion.baidu.com/su?wd='+word+'&cb=showli',
                dataType:'jsonp',
                jsonpCallback:'showli',
                success:function(txt){
                    var arr=txt.s;
                    var li="";
                    $.each(arr,function(i,val){
                        li+="<li>"+val+"</li> ";
                    });
                    $("#rs ul").html(li);
                    $("#rs").slideDown('fast');
                    //鼠标经过元素的背景颜色改变
                    $("#rs ul li").bind('mouseenter',function(){$(this).css({'background':'yellow'})});
                    $("#rs ul li").bind('mouseleave',function(){$(this).css({'background':'#e1e1e1'})});
                    $("#rs ul li").bind('click',function(){
                        $("#wd").val($(this).html());
                        $("#rs").slideUp('fast');
                    });
            }})
    })
    })
</script>

以上就是php实现联想搜索，你会吗？的详细内容，更多请关注创新互联其它相关文章！

网页名称：php怎么实现联想搜索-创新互联
分享网址：https://www.cdcxhl.com/article26/dpehcg.html

成都网站建设公司_创新互联，为您提供网站策划、品牌网站制作、自适应网站、微信小程序、服务器托管、定制网站

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联