js 网页提示框 html文本框,页面版文本框智能提示JS代码

于是这code便诞生了，如下：

var currentIndex=-1;//保存提示框中选择的索引

var sumSearchCount=0;//保存提示框中数据数量

var tempValue="";//保存当前输入的要搜索的内容

var objTxt="";//保存文本框对象

var top=0;//提示框的top

var left=0;//提示框的left

var width=0;//提示框的width

var values = new Array();//保存下拉列表的值

var texts = new Array();//保存下拉列表的显示内容

var tempDiv=new Array();//保存提示框中索引对应的values索引

//获取下拉列表的值和显示内容

function getSelectValues(ddl){

ddlvalue = document.getElementById("DropDownList1");

for(var i=0;i

values[i]=ddlvalue.options[i].value;

texts[i]=ddlvalue.options[i].text;

}

}

var oInterval = "";//保存自动计时对象

function fnStartInterval(txt_id){

getSelectValues("DropDownList1");

objTxt=txt_id;//获取输入文本框对象

top = getLength("offsetTop")+objTxt.offsetHeight;

left= getLength("offsetLeft");

width=objTxt.offsetWidth;

oInterval = window.setInterval("beginSearch()",2000);//启用计时

}

//获取对应属性的长度

function getLength(attribute)

{

var offset = 0;

var txt_input = document.getElementById("txtSearch");

while (item)

{

offset += txt_input[attribute];

txt_input = txt_input.offsetParent;

}

return offset;

}

//停止计时

function fnStopInterval()

{

window.clearInterval(oInterval);

}

//自动完成提示

function beginSearch(){

if(objTxt.value.length>0 && tempValue!=objTxt.value)

{

sumSearchCount=0;

tempValue=objTxt.value;

var div_show = document.getElementById("divMsg");

div_show.style.top=top+"px";

div_show.style.display="block";

div_show.style.left=left+"px";

div_show.style.width=width+"px";

div_show.innerHTML="";

var leng = texts.length;

var txt_value = objTxt.value;

var row="";

for(var i=0;i

if(texts[i].indexOf(txt_value)!=-1){

row = row + "

tempDiv[sumSearchCount]=i;

sumSearchCount++;

}

}

div_show.innerHTML=row;

}

else if(objTxt.value.length==0 || objTxt.value == null)

{

var div_msg = document.getElementById("divMsg");

div_msg.style.display="none";

div_msg.innerHTML="";

}

}

//提示内容单击保存到文本框中

function span_click(sp)

{

clear();

objTxt.value=sp.innerHTML;

document.getElementById("DropDownList1").options[sp.id.substring(sp.id.indexOf('_')+1,sp.id.length)].selected="selected";

}

//停止查询，关闭提示

function closeSearch()

{

var tbl = document.activeElement.parentElement;

if(tbl && tbl.id!="divMsg")//防止使用上下键后丢失提示内容

{

clear();

document.getElementById("divMsg").innerHTML="";

}

else if(currentIndex==-1)

{

clear();

document.getElementById("divMsg").innerHTML="";

}

}

//清空提示

function clear()

{

fnStopInterval();

currentIndex=-1;

tempValue="";

document.getElementById("divMsg").style.display="none";

}

//使用键盘上下方向键和enter键

function changeSelect()

{

var divContent = document.getElementById("divMsg");

if(divContent && divContent.style.display=="block")

{

if (event.keyCode == 38 || event.keyCode == 40 || event.keyCode == 13)

{

if(currentIndex!=-1) document.getElementById("divsearch_"+tempDiv[currentIndex]).style.backgroundColor="";

if (event.keyCode == 38 && currentIndex > 0)

{

currentIndex--;

document.getElementById("divsearch_"+tempDiv[currentIndex]).style.backgroundColor="#3366CC";

}

else if (event.keyCode == 40 && currentIndex < sumSearchCount-1)

{

currentIndex++;

document.getElementById("divsearch_"+tempDiv[currentIndex]).style.backgroundColor="#3366CC";

}

else if (event.keyCode == 13)

{

if(currentIndex > -1)

{

var divpart = document.getElementById("divsearch_"+tempDiv[currentIndex]);

objTxt.value=divpart.innerHTML;

document.getElementById("DropDownList1").options[tempDiv[currentIndex]].selected="selected";

clear();

}

}

}

}

}

以前没有写博客的习惯，好多不经常使用的东西用过就忘了。以后是要整理整理了。