一个简单的智能感知效果
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script src="jquery-1.1.2.js"/>
<script language="javascript">
var rowint = 0;
function doclick()
{
if(event.keyCode == 40 )
{
if(document.all("hidContent").value == ""){document.all("hidContent").value=document.all("txtContent").value;}
if(rowint>0)
{ tabContent.rows[rowint-1].style.background="";}
if(rowint<tabContent.rows.length)
{
tabContent.rows[rowint].style.background="#eeeeee";
document.all("txtContent").value = tabContent.rows[rowint].innerText;
}
if(rowint==tabContent.rows.length)
{
document.all("txtContent").value=document.all("hidContent").value;
tabContent.rows[rowint-1].style.background="";
rowint = -1;
}
rowint ++;
}
else if(event.keyCode == 38)
{
if(rowint>1)
{
rowint --;
tabContent.rows[rowint-1].style.background="#eeeeee";
document.all("txtContent").value = tabContent.rows[rowint-1].innerText;
if(rowint>0) { tabContent.rows[rowint].style.background="";}
}
}
}
function changeContent(obj)
{
if(obj.value != "")
{//生成所需要的table
var oml = $.ajax({url:"getContentByValue.aspx?rnd="+Math.random()+"&tmp="+obj.value,saync:false}).responseText;
if(oml != "")
{document.all("divFilteContent").innerHTML = oml;}
else
{document.all("divFilteContent").innerHTML ="";return;}
}
}
</script>
</HEAD>
<BODY onkeydown="doclick();">
<div>
<input type="text" id= "txtContent" width="260px" ><input type="hidden" id="hidContent" onpropertychange="changeContent(this);">
</div>
<div id = "divFilteContent">
<table id="tabContent" width="151" style="border-left: 1px solid grid; border-right: 1px solid grid;border-bottom: 1px solid grid;" cellpadding="0" cellspacing="0">
<tr>
<td>1</td>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
<tr>
<td>4</td>
</tr>
</table>
</div>
</BODY>
</HTML>