ホームページ >php教程 >php手册 >jquery+php实现用户输入搜索内容时自动提示

jquery+php实现用户输入搜索内容时自动提示

WBOY
WBOYオリジナル
2016-06-06 19:57:181260ブラウズ

可是还有点美中不足,那就是提示框里面的内容不美观,和我们在百度搜索中看到的提示框相比,简直是太丑了,哈哈,不急,我们再用css来调整显示的效 #search_auto li.cls{text-align:right;} /*设置提示框内的关闭按钮效果*/ #search_auto li a:hover{backgro


      可是还有点美中不足,那就是提示框里面的内容不美观,和我们在百度搜索中看到的提示框相比,简直是太丑了,哈哈,不急,我们再用css来调整显示的效

    #search_auto li.cls{text-align:right;} /*设置提示框内的关闭按钮效果*/

    #search_auto li a:hover{background:#D8D8D8; text-decoration:none; color:#000;} /*当鼠标移入提示框内时的效果*/
      现在才算是真正的完全制作完成,至于要不要设置一个延迟处理,或是其它更完善的功能,留给朋友们自己开动脑筋了,大家也可以在下面回复你的想法,等等。
      客户端完整代码:
    
    


    
    jquery+php实现用户输入搜索内容时自动提示
    

    


    
    

    
    

    
    <script><BR> $(function(){<BR> <BR> $(#search_auto).css({width:$(#search input[name="k"]).width()+4});<BR> $(#search input[name="k"]).keyup(function(){<BR> $.post(search_auto.php,{value:$(this).val()},function(data){<BR> if(data==0) $(#search_auto).html().css(display,none);<BR> else $(#search_auto).html(data).css(display,block);<BR> });<BR> });<BR> <BR> });<BR> </script>
    
      服务器端完整代码:
        $v=$_POST[value];
    $re=mysql_query("select * from test where title like %$v% order by addtime desc limit 10");
    if(mysql_num_rows($re)    echo

    ;
        while($ro=mysql_fetch_array($re)) echo
  • .$ro[title].
  • ;
        echo
  • 关闭& gt;
  • ;
        echo
;
    ?>

  [1] [2] 

jquery+php实现用户输入搜索内容时自动提示

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。