мне нужна область ввода текста, чтобы форма отображалась только в том случае, если в раскрывающемся списке выбора выбрано «другое»?

Question

мне нужна область ввода текста, чтобы форма отображалась только в том случае, если в раскрывающемся списке выбора выбрано «другое»?

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>

как я могу это применить? если, конечно, это даже работает...

благодаря

user2789490 18 сен. 2013, в 00:38

Источник

Теги:

javascript

html

2 ответа

Ещё вопросы

beardhatcode · Answer 1 · 2013-09-17T20-01-00.000Z

Вам нужно подождать, пока загрузится DOM. Если вы не будете ждать, пока он не будет загружен, document.getElementById('combo') не вернет annything, и поэтому вы не будете связывать событие.

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);

Hanlet Escaño · Answer 2 · 2013-09-17T19-57-00.000Z

Вам нужно добавить событие после загрузки 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/

Обратите внимание, как я удалил параметр OnLoad из jsFiddle, который добавляет обертку в заголовок (таким образом, он работает для парней в комментариях выше).