标题 | select控件的宽度的设置方法 |
范文 | 自动调整为最大长度: <select> <option >hellohellohellohellohellohellohellohellohellohello</option> </select> 鼠标点时自动变成最大长度,离开或选中时恢复原长度 <select name=s2 onFocus="this.style.width='auto'"onblur="this.style.width='50px'" onChange="this.style.width ='50px'"> <option>1111111111111111111111111111</option> <option>2222222222222222222</option> </select> 鼠标滑过时自动变成最大长度,离开或选中时恢复原长度 <select name=s2 onmouseover="this.style.width='auto'" onblur="this.style.width='50px'" onChange="this.style.width='50px'"> <option>1111111111111111111111111111</option> <option>2222222222222222222</option> </select> 选择后在页面的其它位置显示选择的项目 <div id=dsp></div> <select name="select" size="1" onchange="dsp.innerText=this.options[this.selectedIndex].text"> <option value="1">test</option> <option value="2" selected>test2</option> </select> 鼠标滑过时显示当前选择的项目的值 <div id=div1> <select name=s1 size=1 onmousemove="showTitle(this);"onmouseout="hideTitle(this);"> <option>aaaaaaaaaaaaaaaaaaaaaa1 </option> <option >bbbbbbbbbbbbbbbbbbbbbbbbb1 </option> <option>cccccccccccccccccccccccc1 </option> <option>ddddddddddddddddddddddd1 </option> <option>eeeeeeeeeeeeeeeeeeeeeee1 </option> <option>fffffffffffffffffffffffffff1 </option> </select> </div> <script> // 定义Popup var oP=window.createPopup(); oP.document.body.style.background="beige"; //popup 是否已显示 var oPShow=0; function showTitle(obj){ var h=event.offsetY; var fontsize=(obj.style.fontSize==""?(obj.currentStyle.fontSize==""?"9":obj.currentStyle.fontSize):obj.style.fontSize); fontsize=parseInt(fontsize)*1.6; var l=parseInt(h/fontsize); oP.document.body.innerText=obj.options[l].text; len=obj.options[l].text.length*8; oP.show(event.offsetX+20,event.offsetY+fontsize+5,len,fontsize,document.body); oPShow=1; } function hideTitle(obj){ if(oPShow==1)oP.hide(); } </script> |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。