当前位置:编程学习 > JS >>

jquery+php查询mysql实现自动完成功能

本文章提供一款利用jquery php教程仿google搜索自动完成填充完成输入框效果代码,这里有二款实用的jquery+php查询mysql教程实现自动完成功能源码下载。

<script src="jquery-1.2.1.pack.网页特效" type="text/网页特效"></script>
<script type="text/javascript">

function lookup(inputstring) {
if(inputstring.length == 0) {
// hide the suggestion box.
(‘#suggestions’).hide();
} else {
.post("rpc.php", {querystring: ""+inputstring+""}, function(data){
if(data.length >0) {
(‘#suggestions’).show();
(‘#autosuggestionslist’).html(data);
}
});
}
} // lookup

function fill(thisvalue) {
(‘#inputstring’).val(thisvalue);
(‘#suggestions’).hide();
}

</script>

jquery+php查询mysql实现自动完成功能,写这个教程,因为曾经见到的大部分关于自动完成的应用程序都只是给你一个程序源码包,然后告诉你怎么使用,而不是告诉你它是如何工作的以及为什么这样做。而知道这些可以让你对这个插件可以进一步的按自己的需求定制(关于这一点我在我的blog里写过不少关于其他应用的文章)。

方法二

json

$(function(){
var text = $(".input").text();
settimeout(function(){
if($(".input").text() != text )
{
text = $(".input").text();
$.ajax({
type:"get",
url:"xxxx", //放你的php url
data:{text:text },   //你php接受的数据  名字叫text
datatype:"json",     //传递回来时候用json方式
error:function()
{
alert("ajax载入失败");
},
success: function(json)
     {//json为返回的数据,在这里做数据绑定
   var ottery = json.data;
   var $xiala = $('<div class="xiala><ul id="datas" ><li id="row" ><li></ul></div>');       //><li id="row" ><li>是存放数据的模板
     for(var i=1;i<ottery.length;i++)
        {
        var row = $("#row").clone();
        row.html(ottery[i].sssj);
        row.attr("id","ready");//改变绑定好数据的行的id
        row.appendto("#datas");//添加到模板的容器中     
        }
       $("#row").hide();
       $xiala.appendto("body"); 
    })
  }
},10);
})
补充:网页制作,jquery 
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,