autocompleteextender控件实现自动输入一定需要Web Service吗?
看到书上说可以用本页方法来实现
具体如何做?
请教高手
------解决方案--------------------------------------------------------
参考1
参考2
------解决方案--------------------------------------------------------
也可以用jquery 去实现啊
- HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>google</title> <meta http-equiv="content-type" content="text/html;charset=GBK"> <script type="text/javascript" src="js/jquery-1.3.2.js" charset="GBK"></script> <script type="text/javascript"> var line = 0; var oldValue = ''; function del() { if ($("#newDiv")) { $("#newDiv").remove(); line = 0; } } $(document).ready(function() { //文本框失去焦点时层消失 $(document.body).click(function() { del(); }); }); function vchange() { //alert("value change"); del(); //定位DIV var top = $("#key").offset().top; var left = $("#key").offset().left; var newDiv = $("<div/>").width($("#key").width() + 6).css( "position", "absolute").css("backgroundColor", "white") .css("left", left).css("top", top + $("#key").height() + 6) .css("border", "1px solid blue").attr("id", "newDiv"); /*过滤非法字符输入*/ if($("#key").value != ""){ //alert(oldValue); /*过滤同名多次查询*/ if ($("#key").val() != oldValue) { oldValue = $("#key").val(); var url = 'tsearch.action'; var params = { //POST参数编码处理 key : encodeURI($("#key").val()) }; jQuery.post(url, params, callbackFun, 'json'); } $(document.body).append(newDiv); //添加DIV } if ($("#key").val() == "") { $("#newDiv").remove(); } } //回调函数 function callbackFun(data) { var table = $("<table width='100%'/>").attr("cellpadding", "0").attr( "cellspacing", "0"); if (data.result == "") { //alert("你的关键字有误!"); var tr = $("<tr/>"); var td1 = $("<td/>")("记录为空").css("fontSize", "12px") .css("margin", "5 5 5 5"); tr.append(td1); table.append(tr); $("#newDiv").append(table); } else { var array = data.result.split(","); for ( var i = 0; i < array.length - 1; i++) { //alert(array[i]); var tr = $("<tr/>").css("cursor", "pointer").mouseout( function() { $(this).css("backgroundColor", "white").css( "color", "black"); }).mouseover( function() { $(this).css("backgroundColor", "blue").css("color", "white"); }).click(function() { $("#key").val($(this).find("td").eq(0)()); del(); }); var td1 = $("<td/>")(array[i]).css("fontSize", "12px") .css("margin", "5 5 5 5"); tr.append(td1); table.append(tr); $("#newDiv").append(table); } } } </script> </head> <body> <h1>Google搜索</h1> <div style="margin-top: 20px; margin-left: 30px"> 请输入搜索关键字: <input name="key" id="key" onkeyup="vchange()" style="width: 300"> <input type="button" value="Goolge一下"> </div> </body> </html>