javascript - 基于 dropdown -js 显示/隐藏部分

Question

大家好，我的代码非常漂亮，但问题是它有点错误。当您选择实际取消隐藏某个部分的字段，然后选择另一个隐藏该部分的字段时，“隐藏”部分仍会存在一段时间!下面您将在 codepen 上看到我的代码:http://codepen.io/Nestalna/details/qpjsy

Javascript:

function show(aval) {
    if (aval == "1") {
        optionyes.style.visibility='visible';
        optionyes.style.display='block';
        Form.fileURL.focus();
    } 
    if (aval == "0") {
        optionyes.style.visibility='hidden';
        optionyes.style.display='none';
    }
}

HTML:

<div class="row">
            <label id="title" for="degree">Which degree are you interested in? </label><br />

                <select id="degree" name="degree" onchange="java_script_:show(this.options[this.selectedIndex].value)" >
                    <option selected="selected" value="Please select one"> Please select one </option>
                    <option value="0" > Concurrent Enrolment </option>
                    <option value="1" > 2015 Applied Bioethics Summer Study </option>
                    <option value="2"> Non Degree (9 hours or less) </option>
                </select>
        </div>      

        <div id="optionyes" style="visibility:hidden" >You have selected <strong>red option</strong> so i am here </div>

Answer 1

如果您选择“2”，它根本不会隐藏。你只想在 aval==1 时显示它，对吗？因此将 if (aval == "0") { 更改为 else {

function show(aval) {    
    if (aval == "1") {//if 1 then show it
        optionyes.style.visibility='visible';
        optionyes.style.display='block';
        Form.fileURL.focus();
    } 
    else {//for everything else hide it
        optionyes.style.visibility='hidden';
        optionyes.style.display='none';
    }    
}

http://codepen.io/anon/pen/ywcqf