页面版文本框智能提示JS代码
2024-05-06 14:12:50
供稿：网友
于是这code便诞生了，如下：
代码如下:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script type="text/javascript" language="javascript">
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<ddlvalue.length;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<leng;i++){
if(texts[i].indexOf(txt_value)!=-1){
row = row + "<div style=/"font-size:14px; display:block; width:100%/" id='divsearch_"+i+"' onmouseover=/"this.style.backgroundColor='#3366CC';currentIndex="+i+";/" onmouseout=/"this.style.backgroundColor='';currentIndex=-1;/" onclick=/"span_click(this)/" >"+texts[i]+"</div>";
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";
