如何在jquery中启用和禁用下拉值答案

【问题标题】：How to enable and disable the dropdown values in jquery如何在jquery中启用和禁用下拉值
【发布时间】：2014-06-17 15:47:07
【问题描述】：

这是脚本

$('#first').change(function(){

    switch ($(this).val())
    {
        case '1st':
            $('.1st').show();
            $('.2nd').hide();
            break;

        case '2nd':
            $('.1st').hide();
            $('.2nd').show();
            break;

        case '3rd':
            $('.3rd').hide();
            $('.3rd').show();
            break;

        case 'none':
            $('.1st').show();
            $('.2nd').show();
            break;
    }
});

http://jsfiddle.net/8ZVSu/3/

在第一个下拉列表中，给出了All, Edit, Delete, Modify。我需要这样的..

如果我在第一个下拉列表中单击All，它应该在第二个下拉列表中显示All,051,052,111,123,222,444,555,777,888,911,999。
如果我在第一个下拉菜单中单击 Edit，它应该会显示 All,051,052,111,123,222,444,555,777,888,911,999 在第二个下拉列表中。
如果我在第一个下拉菜单中单击 Delete，它应该只显示 All 在第二个下拉列表中。
如果我在第一个下拉菜单中单击 Modify，它应该只显示 All 在第二个下拉列表中。

我对此毫无疑问。

【问题讨论】：

Is it possible in jquery?你已经用过jquery了
是的，只使用了 jquery。但无法得到正确的。你能帮我写代码吗？>

标签： javascript jquery html drop-down-menu

【解决方案1】：

试试这个：

$('#first').change(function(){
    $('#second option').hide(); // hide all options
    switch ($(this).val())
    {
        case '1st':
            $('.1st').show();
            break;

        case '2nd':
            $('.2nd').show();
            break;

        case '3rd':
            $('.3rd').show();
            break;

        case 'none':
           // show all options except for delete and modify
           $('#second option').not('.3rd, .2nd').show();
            break;
    }
});

Working JSFiddle

【讨论】：

这里有一个问题。如果我在第一个下拉菜单中单击“全部”，它会显示“全部”三遍..你能看一下吗？
这是因为在第 2 类和第 3 类的底部还有两个“全部”选项。
这是在第一个下拉列表中为删除和修改给出的。但是在第一个下拉列表中获得三个所有选项！
如果您不想为删除和修改重复“全部”，那么只使用一个“全部”选项并使其隐藏和显示。
好的，在这种情况下你必须省略这两个'ALL'。看这里jsfiddle.net/8ZVSu/7

【解决方案2】：

Demo 在您的上下文中，您的第一个下拉值，第二个下拉类彼此之间有关系。所以使用this.value获取选定元素

$('#first').change(function () {

    if (this.value == "none") {
        $("#second option").not(".2nd,.3rd").show();
    } else {
        $("#second option").hide();
        $("." + this.value).show();
    }


});

【讨论】：

这里有一个问题。如果我在第一个下拉菜单中单击“全部”，它会显示“全部”三遍..你能看一下吗？
同样的问题仍然存在 balachandran :(
@user3107196。实际上我不明白你被问了什么。现在我更新了我的帖子，请检查一下

【解决方案3】：

两种方式：

您需要 4 秒选择，当您更改第一个下拉菜单时显示其中一个。
使用js模板生成第二个下拉动态。

您不能直接在 chrome 中显示或隐藏 <option>。

【讨论】：