<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>請選擇ABCDEFGHI_select橫排效果_雲棲社區</title> </head> <body> <style> *{font-size:12px;} A.s_l { BORDER: #dddddd 1px solid;BORDER-right: #dddddd 0px solid; BACKGROUND: #ffffff;PADDING: 4px 6px 2px 6px; TEXT-DECORATION: none;line-height:12px } A.s_l:hover { BORDER: #003366 1px solid;BORDER-right: #dddddd 0px solid; BACKGROUND: #0063dc;COLOR: #ffffff; TEXT-DECORATION: none;line-height:12px } A.s_r { BORDER: #dddddd 1px solid;BACKGROUND: #ffffff; PADDING: 4px 6px 2px 6px; TEXT-DECORATION: none;line-height:12px } A.s_r:hover { BORDER: #003366 1px solid;BACKGROUND: #0063dc;COLOR: #ffffff; TEXT-DECORATION: none;line-height:12px } input {BORDER: #aaa 1px solid;width:65px;height:23px;PADDING: 4px 6px 0px 6px;background:url(http://bbs.blueidea.com/attachment.php?aid=90338&noupdate=yes) no-repeat 95% center;} .span1 {position:relative;top:3px;} .span2 {position:relative;left:-3px;top:1px} </style> <span class="span1"><input type="text" value="請選擇" onclick="sele(this)"></span> <span class="span2" id="select" >ABCDEFGHI</span> <script> function sele(o){ var oobj=document.getElementById("select") if (oobj.style.display=="none"){ oobj.style.display="" var obj=oobj.getElementsByTagName("a"),j=obj.length for (var i=0;i<j;i++){ obj[i].onclick=function(){ o.value=this.innerHTML; oobj.style.display="none" } } } else oobj.style.display="none" } </script> </body> </html>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
