自动提示下拉框其他__脚本特效_后台技术填写、输入飞飞Asp技术乐园

＞设为首页

＞收藏本站

＞最新电影

首页运营资讯今日英语图形图像计算机技术 Asp编程网站结构化资源共享休闲娱乐访问新站

您现在的位置：首页=>后台技术=>脚本特效=>其他

订阅本栏目

自动提示下拉框

时间： 2008-03-20 23:14:54　阅读次数：2439

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<script language="javascript">
var intIndex=0;arrList = new Array();
function dearray(aa)//定义array
{
//document.write(aa);
arrList = aa.split(',');
intIndex = arrList.length;
}
function test() {
init();
dearray("asp,csdn,aaaa,bbbbc,afd,werwe,adfs,ertr,qwq,qwqwq,trt,uyus,dsfs,uere,add,234,2,1dr4,ae4564,adf4645,afa3543,sdfse5,ae345345,sdf4564,34346536");
smanPromptList(arrList,"aspx");
dearray("1sdfsdf.com,a11sdafs.net,b22dsafsdf,c333asdfsadf,4444dsafasdf,dddsfddsafdsaf,121213dsafsdaf,43213asdfadsf,dsa3121dasf3,a213,323313,3213,32213,dsfsdddd,ds11dfsfd,ffdafd,afdfd,afd,baffad,2fda2fd,dasd");
smanPromptList(arrList,"aspx2");
smanPromptList(arrList,"inputer")
}
function init() {
if (arrList.constructor!=Array){alert('smanPromptList初始化失败:第一个参数非数组!');return ;}
arrList.sort( function(a, b) {
if(a.length>b.length)return 1;
else if(a.length==b.length)return a.localeCompare(b);
else return -1;
}
); 
}

function smanPromptList(arrList,objInputId){
var objouter=document.getElementById("__smanDisp") //显示的DIV对象
var objInput = document.getElementById(objInputId); //文本框对象
var selectedIndex=-1;
var intTmp; //循环用的:)
if (objInput==null) {alert('smanPromptList初始化失败:没有找到"'+objInputId+'"文本框');return ;}
//文本框失去焦点
objInput.onblur=function(){
objouter.style.display='none';
}
//文本框按键抬起
objInput.onkeyup=checkKeyCode;
//文本框得到焦点
objInput.onfocus=checkAndShow;
function checkKeyCode(evt){
evt = evt || window.event;
var ie = (document.all)? true:false
if (ie){
var keyCode=evt.keyCode
if (keyCode==40||keyCode==38){ //下上
var isUp=false
if(keyCode==40) isUp=true ;
chageSelection(isUp)
}else if (keyCode==13){//回车
outSelection(selectedIndex);
}else{
checkAndShow(evt)
}
}else{
checkAndShow(evt)
}
divPosition(evt)
}
function checkAndShow(evt){
var strInput = objInput.value
if (strInput!=""){
divPosition(evt);
selectedIndex=-1;
objouter.innerHTML ="";
for (intTmp=0;intTmp<arrList.length;intTmp++){
if (arrList[intTmp].substr(0, strInput.length)==strInput){
addOption(arrList[intTmp]);
}
}
objouter.style.display='';
}else{
objouter.style.display='none';
}
function addOption(value){
objouter.innerHTML +="<div onmouseover=\"this.className='sman_selectedStyle'\" onmouseout=\"this.className=''\" onmousedown=\"document.getElementById('"+objInputId+"').value='" + value + "'\">" + value + "</div>" 
}
}
function chageSelection(isUp){
if (objouter.style.display=='none'){
objouter.style.display='';
}else{
if (isUp)
selectedIndex++
else
selectedIndex--
}
var maxIndex = objouter.children.length-1;
if (selectedIndex<0){selectedIndex=0}
if (selectedIndex>maxIndex) {selectedIndex=maxIndex}
for (intTmp=0;intTmp<=maxIndex;intTmp++){
if (intTmp==selectedIndex){
objouter.children[intTmp].className="sman_selectedStyle";
}else{
objouter.children[intTmp].className="";
}
}
}
function outSelection(Index){
objInput.value = objouter.children[Index].innerText;
objouter.style.display='none';
}
function divPosition(evt){
var left = 0;
var top = 0; 
var e = objInput;
while (e.offsetParent){
left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
top += e.offsetTop + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
e = e.offsetParent;
}
left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
top += e.offsetTop + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
objouter.style.top = (top + objInput.clientHeight) + 'px' ;
objouter.style.left = left + 'px' ; 
objouter.style.width= objInput.clientWidth;
}
}
document.write("<div id='__smanDisp' style='position:absolute;display:none;background:#E8F7EB;border: 1px solid #CCCCCC;font-size:14px;cursor: default;' onbulr> </div>");
document.write("<style>.sman_selectedStyle{background-Color:#102681;color:#FFFFFF}</style>");
function getAbsoluteHeight(ob){
return ob.offsetHeight
}
function getAbsoluteWidth(ob){
return ob.offsetWidth
}
function getAbsoluteLeft(ob){
var mendingLeft = ob .offsetLeft;
while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" ){
mendingLeft += ob .offsetParent.offsetLeft;
mendingOb = ob.offsetParent;
}
return mendingLeft ;
}
function getAbsoluteTop(ob){
var mendingTop = ob.offsetTop;
while( ob != null && ob.offsetParent != null && ob.offsetParent.tagName != "BODY" ){
mendingTop += ob .offsetParent.offsetTop;
ob = ob .offsetParent;
}
return mendingTop ;
}
Number.prototype.NaN0 = function()
{
return isNaN(this)?0:this;
}
</script>
<body onLoad="test()">
下拉提示跟着 MOuse 走的。。想把他改成在文本框下出来的那种怎么改
<input type="text" id="aspx"><br/>
<input type="text" id="aspx2">
<table width="970" border="0" align="center">
<tr>
<td><table width="100%" border="0" align="center">
<tr>
<td align="center" valign="middle"> </td>
</tr>
</table>
<table border="1" align="center" 
cellspacing="1" bordercolor="#9CD7FF" id="table1" style="BORDER-COLLAPSE: collapse" >
<tr bgcolor="#99CCFF">
<td bgcolor="#CEE3FF"><font class="text">日期</font></td>
<td bgcolor="#FFFFFF"><input type="text" id="inputer"></td>
</tr>
<tr bgcolor="#99CCFF">
<td bgcolor="#CEE3FF"><font class="text">制造号码</font></td>
<td bgcolor="#FFFFFF"></td>
</tr>
<tr bgcolor="#99CCFF">
<td height="24" bgcolor="#CEE3FF"><font class="text">作业内容</font></td>
<td height="24" bgcolor="#FFFFFF"> </td>
</tr>
</table>
<br /></td>
</tr>
</table>
</body></html>

提示：您可以先修改部分代码再运行

下一篇飞飞input表单输入框默认提示信息插件

上一篇用键盘打开网页代码

本栏目最新

栏目最新列表

xhEditor v1.1.7 发布，国产开源XHTML在线编

收集的一些轻量级非常实用的前端开发小工具

javascript中cookie的设置，读取，删除

jquery插件:飞飞表情插件v1.0_[普通表情/魔

Jquery插件：textarea使用“autoresize”自

网站优化策划

栏目最新列表

增加网站外链的快速方法

网站上线前必做的30个检查

新的友情链接参考标准（没有google的PR情况

优化Google的AdSense广告的五个工具

王通讲SEO八大基础

站点最新

站点最新列表

微博推广的一些技巧

xhEditor v1.1.7 发布，

收集的一些轻量级非常实

50个新鲜兼容最新版本的

javascript中cookie的设

Excel中出现#VALUE!、#D

jquery插件:飞飞表情插件

十个使用HTML5开发的精彩

支持HTML5的浏览器有哪些

飞妮莫属:漫画：如何写出

历史最热10条信息

MIME介绍及 [1] [2] [3]

巧用Google和迅雷来下载

Transact SQL 常 [1] [2]

VIA Rhine II Fast Ethe

电脑常用端 [1] [2] [3]

Do you get a kick out

十道羊皮卷欣赏+mp3版+

每日一句：A friend and

每日一句：Theres no tu

经典__悟透JavaScript

width=

伟哥博客西安房产 123最新电影三四六四

关于站点 | 免责声明 | 联系站长 | 网站地图 | 陕ICP备07002804号 WEB技术QQ交流群：72840059

©2007 ffasp.com. 版权所有