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

Question

Этот код отлично работает, но я бы хотел его изменить, поэтому вместо выпадающего меню вы можете выбрать выпадающий список. Например, в меню выпадающего меню выберите «Больше?». будет «да» или «нет». Если в меню выбрано «да», я хочу, чтобы скрытый div показывался так же, как и при проверке флажка в текущем коде.

Javascript:

<script language="JavaScript"> 
    function showhidefield() 
    { 
    if (document.frm.chkbox.checked) 
    { 
     document.getElementById("hideablearea").style.display = "block"; 
    } 
    else 
    { 
     document.getElementById("hideablearea").style.display = "none"; 
    } 
    } 
</script> 

И это HTML:

<form name='frm' action='nextpage.asp'> 
    <input type="checkbox" name="chkbox" onclick="showhidefield()"> 
    Check/uncheck here to show/hide the other form fields 
    <br> 
    <div id='hideablearea' style='visibility:hidden;'> 
    <input type='text'><br> 
    <input type='submit'> 
    </div> 
    This is a text line below the hideable form fields.<br> 
</form> 

Спасибо.

Answer 1

Замените флажок с

<select name="more" onchange="showhidefield()"> 
    <option value="yes">Yes</option> 
    <option value="yes">Yes</option> 
</select> 

И заменить

if (document.frm.chkbox.checked) 

в вашей showhidefield() функции с

if (document.frm.more.value == 'yes') 

Answer 2

<form name='frm' action='nextpage.asp'> 
    <select name="chkbox" onChange="showhidefield(this)"> 
    <option value="0" selected="true">-Select-</option> 
    <option value="1">Yes</option> 
    <option value="2">No</option> 
    </select> 
    Check/uncheck here to show/hide the other form fields 
    <br> 
    <div id='hideablearea' style='display:none;'> 
    <input type='text'><br> 
    <input type='submit'> 
    </div> 
    This is a text line below the hideable form fields.<br> 
</form> 

И Javascript код:

<script language="JavaScript"> 
    function showhidefield(that) 
    { 
    if (that.value == 1) 
    { 
     document.getElementById("hideablearea").style.display = "block"; 
    } 
    else 
    { 
     document.getElementById("hideablearea").style.display = "none"; 
    } 
    } 
</script>