PHP联想搜索


  参考: https://blog.csdn.net/myhuashengmi/article/details/51986592

<meta charset="utf-8">
<input type="text" name="search_keywords" id="search-key-word" class="x-input" autocomplete="off">
<div style='width:750px;background-color: #ffffff;z-index: 100;margin-left:115px;position:absolute;display: none;' id="search_list">
      <ul style="border: 1px solid #ccc;">ul>
  div>
<script src="/jquery/jquery.js">script> //注意jquery引进路径
<script>
    $(function(){

  $("#search-key-word").keydown(function (e) { 
      if (e.which == 13) {
          $('.btn-search').trigger("click");
      }  
  }); 
  $("#search-key-word").keyup(function(){
    var word = $(this).val();
    var type = $("#search_type").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+="
  • "+val+"
  • "; }); $("#search_list ul").html(li); $("#search_list").slideDown('fast'); //鼠标经过元素的背景颜色改变 $("#search_list ul li").bind('mouseenter',function(){$(this).css({'background':'#e1e1e1'})}); $("#search_list ul li").bind('mouseleave',function(){$(this).css({'background':'#ffffff'})}); $("#search_list ul li").bind('click',function(){ $("#search-key-word").val($(this).text()); $("#search_list").slideUp('fast'); $('.btn-search').trigger("click"); }); } }); }); $(document).click(function(){ $("#search_list").hide(); }); }) script>
    js