在网上搜了许多,累shi了,折腾了半天,终于搞定,总结一下下...
1. 需要jquery-1.3.2.min.js (++),jquery.autocomplete.js,jquery.autocomplete.css 三个文件。哪里有?google..
2. 前端页面 js 如下:
user.js
$(function() { $("#u_name").blur(function(){ //查询user表,检查是否存在,存在,则将用户信息显示;不存在,刚更新隐藏域,标识为new //如果是新添加的用户,保存到数据库。 var u_name = $.trim($("#u_name").val()); if(u_name != ""){ $.ajax({ url:"finduser.php", type:"get", dataType:"json", data:{username:$("#u_name").val(),u:"definate_text"}, error:function(){ sessionTimeOut(); }, success:function(data){ if(data!=null){ $("#u_mail").attr("value",data.mail); $("#u_phone").attr("value",data.phone); $("#u_office").attr("value",data.office); $("#existflag").attr("value",data.existflag); } } }); } }); //here $("#u_name").autocomplete("finduser.php", { cacheLength:0, selectFirst:true, matchSubset:false, multiple: false, width:135, max:20, dataType: 'json', extraParams: {username:function(){return $("#u_name").val();},u:"indefinate_text"}, parse: function(data) { var rows = []; if(""!=data){ for(var i=0; i<data.length; i++){ rows[rows.length] = {data:data[i],result:data[i]}; } } return rows; } }); $(document).keydown(function(event){ if(event.keyCode==13){ if((document.activeElement.id=="u_name") && ($.trim($("#u_name").val()).length>1)){ $("#u_name").blur(); } } });});
3. 后台PHP部分:
finduser.php
<?php$flag= $_GET['u'];if($flag=='definate_text'){ $sql = "select * from $users_table where user_name = '".$_GET['username']."'"; $autoresult = $db->query($sql); $autorow = $db->fetch_array($autoresult); $autoemail = $autorow[email]; $autooffice = $autorow[office]; $autophone = $autorow[phone]; $existflag=1; if ($autorow==false){ $existflag=0;//0不存在,1存在。 } $array=array('mail'=>"$autoemail",'office'=>"$autooffice",'phone'=>"$autophone",'existflag'=>"$existflag"); echo json_encode($array);}if($flag=='indefinate_text'){ $sql = "select user_name from $users_table where user_name like '".$_GET['username']."%'"; $autoresult = $db->query($sql); //$db是创建好的mysql_connect,query方法其实调用的是mysql_query $array=array(); while($row = $db->fetch_array($autoresult)){ array_push($array,array($row['user_name'])); } echo json_encode($array);}?>
4. 前台页面就一输入框,主要是以上PHP的返回及JS的处理。