您的位置:首页 > Web前端 > JQuery

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

2013-09-05 20:23 996 查看
本文章提供一款利用jquery php仿google搜索自动完成填充完成输入框效果代码,这里有二款实用的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);
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: