参照元：http://vdonkey.blog.shinobi.jp/Entry/1/
このサイトではうまく動かないようである。窓が二つになった。
記述は以下。html5から、type="search"が追加されたので、"text"から"search"に修正済み。
<input id="txtopt-t1" type="search" value="default" style="border:0;position:relative;left:2;top:-1;width:100px;z-index:1"> <select id="txtopt-o1" style="position:relative;left:-105px;top:0;width:122px;z-index:0" onchange="document.getElementById('txtopt-t1').value=this.options[this.selectedIndex].text;this.selectedIndex=-1;" onblur="this.selectedIndex=-1;"> <option>option-1</option> <option>option-2</option> </select> <script> document.getElementById("txtopt-o1").selectedIndex = -1; </script> |
代替として以下のhtm文書を作成し、chromeとIE9で試してみる。
<html> <meta charset="utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <body> <input id="txtopt-t1" type="search" value="default" style="border:0;position:relative;left:2;top:-1;width:100px;z-index:1"> <select id="txtopt-o1" style="position:relative;left:-105px;top:0;width:122px;z-index:0" onchange="document.getElementById('txtopt-t1').value=this.options[this.selectedIndex].text;this.selectedIndex=-1;" onblur="this.selectedIndex=-1;"> <option>option-1</option> <option>option-2</option> </select> <script> document.getElementById("txtopt-o1").selectedIndex = -1; </script> </body> </html> |
するとChromeではうまく作動。IE9は文字入力後のプルダウンの制御が利かない。
No comments:
Post a Comment