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);
})

时间: 2024-09-19 08:16:49

jquery+php查询mysql实现自动完成功能的相关文章

利用jquery.autocomplete自动完成功能实现百度搜索下拉功能

利用jquery.autocomplete自动完成功能实现百度搜索下拉功能 --> <script language="网页特效" src="jquery.autocomplete.js"></script> <script> $().ready(function() {  $("#borough_name").autocomplete("z.php教程", {   minchars:

基于jQuery实现搜索关键字自动匹配功能_jquery

今天我们就一起来看一个简单的基于jquery的关键字自动匹配的例子,希望文章能够对各位有帮助.例子一 在项目中,有时候需要用户选择城市,但是城市太多,用户选择起来不太方便,所以提供了一个用户可以通过输入框输入城市的汉字或者拼音简写.结果示意图如下: 当输入拼音后结果示意图如下: 实现代码如下: <html><head><title>实时查询城市通过姓名或拼音简写</title></head><meta charset = "utf

jQuery的Ajax的自动完成功能控件简要说明_jquery

jQuery的Ajax的自动完成功能允许您轻松地创建自动完成/自动提示框的文本输入字段.它始建集中表现为每一个查询缓存被从本地缓存中相同的重复的查询结果.如果没有特定查询的结果,它停止发送请求到服务器的其他查询. Ajax的自动完成的jQuery的是麻省理工学院风格的许可证的条款下自由分发.这是目前支持的浏览器:IE 7 +,FF 2 +,Safari 3以上,谷歌9 +. 要求:jQuery框架下载链接:http://www.devbridge.com/projects/autocomplet

利用JQuery方便实现基于Ajax的数据查询、排序和分页功能

ajax|分页|排序|数据        之前很少会用javascript去实现页功能主要怕麻烦,但了解JQuery后这种想法发生了变化:有了这样的脚本组件就可以在编写脚本时方便和HTML隔离出来,这样编写高重用性的脚本就更方便.下面就是介绍在学习JQuery过程中编写的基于Ajax的数据查询.排序和分页功能的复用脚本,只要遵循脚本的某些规则描述HTML把脚本文件引入就可以方便实现以上描述的功能.        先看下实现功能的脚代码: /**应用脚本规则:           引用脚本: JQ

JQuery记住用户名密码实现下次自动登录功能

  这篇文章主要介绍了JQuery记住用户名密码实现下次自动登录功能,本文直接给出实现代码,需要的朋友可以参考下 Jquery将用户名密码存储到cookie中 需要导入jquery.js和jquery.cookie.js ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 <html> <head> &l

jquery 实现输入邮箱时自动补全下拉提示功能_javascript技巧

记得去年做某个项目的时候,用到了邮箱输入自动提示功能,于是网上搜了一下,发现了这个写得不错,现在回想起来,转载一下,方便查阅. 邮箱的广泛使用得益于它的免费,因此很多网站在注册的时候都会直接使用邮箱作为账号名 为了提高用户的体验,很多网站都会实现邮箱输入的自动提示功能. 实现效果如图所示: 核心代码(需要jquery的支持): (function($){ $.fn.mailAutoComplete = function(options){ var defaults = { boxClass: "

Jquery插件仿百度搜索关键字自动匹配功能_jquery

本文实例为大家分享了Jquery搜索关键字自动匹配功能的实现代码,供大家参考,具体内容如下jQuery AutoComplete 是一个基于jQuery实现搜索关键字自动匹配提示的插件,该插件可扩展性强,表现性能优越,方便整合到自己的项目中使用:兼容IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+, and Chrome 1.0+ 等主流浏览器. 下面是具体的使用方法: 1.使用设置 首页,要把插件的js代码嵌入到你自己的项目中去. 复制代码 代码如下: <scri

JQuery+Ajax实现数据查询、排序和分页功能_jquery

之前很少会用javascript去实现页功能主要怕麻烦,但了解JQuery后这种想法发生了变化:有了这样的脚本组件就可以在编写脚本时方便和HTML隔离出来,这样编写高重用性的脚本就更方便.下面就是介绍在学习JQuery过程中编写的基于Ajax的数据查询.排序和分页功能的复用脚本,只要遵循脚本的某些规则描述HTML把脚本文件引入就可以方便实现以上描述的功能. 先看下实现功能的代码: /**应用脚本规则: 引用脚本: JQuery脚本和JQuery的form插件脚本 Form的ID: viewfor

jQuery实现Email邮箱地址自动补全功能代码_jquery

本文实例讲述了jQuery实现Email邮箱地址自动补全功能代码.分享给大家供大家参考,具体如下: jQuery Email邮箱地址自动补全代码,输入Email时,会自动加入@符号,在输入框中输入"qq"."Sina"."163"等等可以看到效果:鼠标经过提示Email时,高亮该条Email,鼠标点击Email时,文本框内容替换成该条Email,并删除提示层. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js