位置：首页>> 网络编程>> JavaScript>> 可输入的select代码

可输入的select代码

　来源：asp之家　发布时间：2009-12-26 18:25:00　

标签：select,代码

代码如下：

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>可输入的select - asp之家</title> <style> .optionForSel {font-size:9pt} </style> </head> <body leftmargin="50" topmargin="50"> <table cellpadding="0" cellspacing="0" border="0" width="300"> <tr> <td id="selectLength" width="100％" style="height:20px;padding:0px;border:2px inset #404040;border-right:0px;border-bottom:1px solid #D4D0C8;font-size:9pt;"> <div id="selectedValue" style="padding:2px;border:0px;width:100％;height:20px;font-size:9pt;vertical-align:bottom"></div> </td> <td width="20" style="height:20px;padding:0px;border-top:2px inset #404040;border-left:0px;border-right:1px solid #D4D0C8;border-bottom:1px solid #D4D0C8;font-size:9pt"> <img src="images/button2.gif" border="0" id="mm" onclick="mm_Click()" align="absmiddle" width="18" height="18"> </td> </tr> </table> <div id="dropdownOption" style="position:absolute;visibility:hidden;width:100％;border:1px solid #080808;z-index:10"> <table width="100％" cellpadding="0" cellspacing="1" class="optionForSel" bgcolor="White"> <tr> <td onmouseover="this.style.backgroundColor='#0099ff'" onmouseout="this.style.backgroundColor=''" onclick="document.all.selectedValue.innerText=this.innerText"> Visit1 </td> </tr> <tr> <td onmouseover="this.style.backgroundColor='#0099ff'" onmouseout="this.style.backgroundColor=''" onclick="document.all.selectedValue.innerText=this.innerText"> Visit2 </td> </tr> <tr> <td onmouseover="this.style.backgroundColor='#0099ff'" onmouseout="this.style.backgroundColor=''" onclick="document.all.selectedValue.innerText=this.innerText"> Visit3 </td> </tr> </table> </div> <script> function mm_Click(){ if (document.all.dropdownOption.style.visibility == 'visible') document.all.dropdownOption.style.visibility = 'hidden' else document.all.dropdownOption.style.visibility = 'visible' } function init(){ document.all.dropdownOption.style.width = document.all.selectLength.clientWidth + 22; document.all.selectedValue.contentEditable = true; var strTop = 0; var strLeft = 0; var e1 = document.all.selectLength; while(e1.tagName != "BODY"){ strTop += e1.offsetTop strLeft += e1.offsetLeft e1 = e1.offsetParent } document.all.dropdownOption.style.top = String(strTop + 24) + "px"; document.all.dropdownOption.style.left = String(strLeft) + "px"; } function clickE(){ if(window.event.srcElement.id !='mm') document.all.dropdownOption.style.visibility = 'hidden'; } document.onclick = clickE window.onload = init </script> <br> <br> <input type="button" value="得到选中的值" onclick="alert(document.all.selectedValue.innerText)"> </body> </html>

投稿

可输入的select代码

猜你喜欢