Question

我的页面上有<select>菜单。

我希望如果selectedIndex 不等于'1'（即 if（this.selectedIndex！= 1 ））那么它会禁用（{ {1}}）我网页上的另一个<select disabled="disabled">菜单。

我如何实现这一目标？

谢谢。

Answer 1

在第一个选择（change或旧IE，addEventListener()）上绑定attachEvent()个事件
- MDC on addEventListener
在事件处理程序中，检查selectedIndex是否为1
如果不是1，在DOM中找到第二个选择，并禁用它（将其disabled属性设置为true）

编辑：我创建了一个小小提琴，按照我描述的方式解决问题。我建议不要在HTML（onchange="xz()"）中使用内联事件处理程序，有更多高级技术可用，HTML应该只是标记，没有样式和行为。

所以，它就像这样容易：

document.getElementById('fos1').addEventListener('change', function() {
    document.getElementById('fos2').disabled=this.selectedIndex != 1;
});

其中fos1和fos2是您选择框的ID。

Answer 2

<select id="first"><option>a</option><option>b</option></select>
<select id="second"></select>

<script type="text/javascript">
    document.getElementById('first').addEventListener('change', function() {
       if(this.selectedIndex != 1) {
           document.getElementById('second').disabled = true;
       }
       else {
           document.getElementById('second').disabled = false;
       }
    });
</script>

jsFiddle Demo

Answer 3

喜欢这个吗？

http://jsfiddle.net/rdeww/1/

JQ

$('#one').change(function () {
    var selected = $(this).find(':selected').val();  

    if(selected != 1) {
        $('#two').attr('disabled','disabled');
    } else {
        $('#two').attr('disabled',false);
    }
});

HTML

<select id="one">
    <option value="1">Dont disable</option>
    <option value="2">Disable</option>
    <option value="3">Disable</option>
    <option value="4">Disable</option>
    <option value="5">Disable</option>
</select>
<select id="two">
    <option value="1">Random select</option>
    <option value="2">Random select</option>
    <option value="3">Random select</option>
    <option value="4">Random select</option>
    <option value="5">Random select</option>
</select>

更改一个选择菜单会禁用网页上的另一个选择菜单？

3 个答案: