Javascript禁用另一个选择框选项上的选择框

时间:2013-10-21 18:46:17

标签: javascript html

我有两个选择下拉列表:

<select name="internal_message">
<option value="yes">Yes</option>
<option value="" selected="selected">No</option>
</select>

<select name="internal_message_agent">
<option value="">Choose</option>.... etc
</select>

我试过了:

<select name="internal_message">
            <option value="yes" onClick="document.getElementById('internal_message_agent').disabled=!this.selected;">Yes</option>
            <option value="" selected="selected">No</option>
            </select>

但它不起作用 - 如何在internal_message选定值为"No"时禁用internal_message_agent select元素,并在所选选项为"Yes"

2 个答案:

答案 0 :(得分:4)

为每个选择添加ID并使用jquery将其禁用,如下所示:

$('#box1').on('change', function(){
if($(this).val()==='no'){
    $('#box2').attr('disabled', 'disabled');
}else{
    $('#box2').attr('disabled', false);
}
});

http://jsfiddle.net/3MCaG/1/

答案 1 :(得分:0)

这是Javascript和HTML的样子。

<!DOCTYPE html>
<html>
<head>
</head>
<script>
function validate(){
    var b1 = document.getElementById("box1");
    var f = b1.options[b1.selectedIndex].value;
    var b2 = document.getElementById("box2");
        if(f == "no"){
        b2.disabled="disabled";
        }
    else{
    b2.disabled="";
    }
}
</script>
<select id="box1" onchange="validate()">
    <option id="yes" value="yes">Yes</option>
    <option id="no" value="no" selected="selected">No</option>
</select>

<select id="box2" disabled>
    <option></option>
    <option value="">Choose</option>
</select>
</html>