首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > JAVA > Java Web开发 >

求教类似IE地址栏的输入提示功能解决办法

2012-03-02 
求教类似IE地址栏的输入提示功能请问各位达人如何实现类似IE地址栏的输入的提示功能[解决办法] htmlhea

求教类似IE地址栏的输入提示功能
请问各位达人   如何实现类似IE地址栏的输入的提示功能

[解决办法]
<html>
<head>
<title> tips </title>

<script>
function getText(li)
{
document.getElementsByName( "dddd ")[0].value=li.innerText;
document.getElementById( "tips ").style.display= "none ";
}
function catch_keydown()
{

}
function catch_up(inp)
{
var inn=inp.value;
if(inn== " ")
{
document.getElementById( "tips ").style.display= "none ";
return;
}
var list=document.getElementById( "options ").children;
var ts=new Array(list.length);
for(var i=0;i <list.length;i++)
{
if(list[i].innerText.indexOf(inn)==0)
ts[i]=list[i].innerText;
}
var html= " <ul> ";
for(var i=0;i <ts.length;i++)
{
if(ts[i]!=undefined)
html=html+ " <li onclick= 'getText(this); '> "+ts[i]+ " </li> ";
}
html=html+ " </ul> ";
document.getElementById( "tips ").innerHTML=html;
document.getElementById( "tips ").style.display= "block ";
}
</script>
</head>

<body>
<p>
<input id= "val " name= "dddd " type= "text " onkeyup= "catch_up(this); "/>
</p>
<p>
<div id= "tips " style= "display: none;position: absolute; background-color: red; color: blue; "> </div>
</p>
</ul>
<ul id= "options ">
<li onclick= "getText(this); "> 两语法能 </li>
<li onclick= "getText(this); "> 两的了解 </li>
<li onclick= "getText(this); "> 机动力分解 </li>
<li onclick= "getText(this); "> 接诶昂 </li>
</ul>
</body>
</html>


你看看,就是这样的思路

热点排行