0

さて、私の質問は非常に単純で簡単です。ドロップ ダウン リストの html は十分に簡単です。ここで使用することがわかったスクリプトと html

<select id='combo'>
<option>Yes</option>
<option>No</option>
<option>other</option>
</select>
<input  id='text1' style='display: none'/>
<input  id='text2' style='display: none'/>

<script>

document.getElementById('combo').onchange = function() {
var display = this.selectedIndex == 2 ? "inline" : "none";
document.getElementById('text1').style.display = display;
document.getElementById('text2').style.display = display;
}
</script>

これを適用するにはどうすればよいですか？もちろん、これでも機能する場合...

ありがとう

4

2 に答える 2

0

DOM がロードされた後にイベントを追加する必要があります。

window.onload = function()
{
    document.getElementById('combo').onchange = function() {
        var display = this.selectedIndex == 2 ? "inline" : "none";
        document.getElementById('text1').style.display = display;
        document.getElementById('text2').style.display = display;
    }
}

また

document.addEventListener("DOMContentLoaded", function(event)
{
    document.getElementById('combo').onchange = function() 
    {
        var display = this.selectedIndex == 2 ? "inline" : "none";
        document.getElementById('text1').style.display = display;
        document.getElementById('text2').style.display = display;
    }
});

https://developer.mozilla.org/en-US/docs/Web/Reference/Events/DOMContentLoaded

http://jsfiddle.net/J9rXS/1/

jsFiddle から OnLoad オプションを削除したことに注意してください。これにより、ヘッダーにラップが追加されます (したがって、上記のコメントの人たちのために機能しています)。

于 2013-09-17T22:42:28.773 に答える
0

DOM がロードされるまで待つ必要があります。ロードされるまで待たdocument.getElementById('combo')ないと何も返されないため、イベントをバインドしません。

document.addEventListener("DOMContentLoaded", function(){

  document.getElementById('combo').onchange = function() {
    var display = this.selectedIndex == 2 ? "inline" : "none";
    document.getElementById('text1').style.display = display;
    document.getElementById('text2').style.display = display;
  }

},false);
于 2013-09-17T22:45:22.677 に答える