ASP.Net中 用 “jquery.autocomplete”遇到的问题
胜多负少 --------------------编程问答-------------------- 我认为完成 --------------------编程问答-------------------- 不明白LZ的意思。 --------------------编程问答--------------------什么问题？ --------------------编程问答--------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>google.html</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/>").html("记录为空").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).html());
del();
});
var td1 = $("<td/>").html(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>
下载jquery-1.3.2.js
放js文件夹下 保存HTMl看效果
补充：.NET技术 , ASP.NET
