1.首先导入jquery.js文件
2.写样式,此样式是设置自动完成项显示的
<style type="text/css">
A.liwc
{
background-color: #ffffff;
display: block;
width: 100%;
height: auto;
color: #274f57;
text-decoration: none;
}
A.liwc:hover
{
background-color: #D3F1AB;
font-size: 12px;
color: #274f57;
width: 100%;
height: auto;
text-decoration: none;
}
</style>
3.把一下代码封装到一个js里面
jQuery(function(){
//input获取焦点时在其旁边显示div
$.extend({
zdwc:function(inp,divwc,url){
var input = $("#"+inp);
var offset = input.offset();
$('#'+divwc).css('width',input.css("width"));
$('#'+divwc).css('display','block');
$('#'+divwc).css('top',offset.top+16);
$('#'+divwc).css('left',offset.left);
$.getJSON(url,{ xm: input.val()},function(data){
var li="<ul style='margin:0px;padding:0px;'>";
$.each(data, function(i,item){
if(item!=null){
li+="<li style='width:"+input.css("width")+";list-style-type:none;'><a class='liwc'>"+item.Xm+"</a></li>"
}
});
li+="</ul>";
$("#"+divwc).html(li);
$(".liwc").click(function(){ var yhm=$(this).text();input.val(yhm); $('#'+divwc).css('display','none');});
});
}
});
});
4.一般处理程序中
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
System.Web.Script.Serialization.JavaScriptSerializer js = new System.Web.Script.Serialization.JavaScriptSerializer();
string yhm=context.Request["xm"] ?? "";
context.Response.Write(js.Serialize(lis(yhm)));
}
public System.Collections.Generic.List<t_yh01> lis(string ll)
{
System.Collections.Generic.List<t_yh01> name = new System.Collections.Generic.List<t_yh01>();
if (ll != "")
{
name=t_yh01DAO.Gets(" where xm like '" + ll + "%' order by xm");
}
return name;
}