MyException - 我的异常网
当前位置:我的异常网» Java Web开发 » 求教类似IE地址栏的输入提示功能解决办法

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

www.MyException.Cn  网友分享于:2013-03-03  浏览:17次
求教类似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>


你看看,就是这样的思路

文章评论

软件开发程序错误异常ExceptionCopyright © 2009-2015 MyException 版权所有