克隆下拉列表后，禁用之前的下拉列表答案

【问题标题】：After cloning a dropdownlist, disable the previous dropdownlist克隆下拉列表后，禁用之前的下拉列表
【发布时间】：2015-07-23 05:06:19
【问题描述】：

我有一个 asp.net 下拉列表和一个 html 按钮。单击按钮（此处命名为克隆）时，我应该根据以下场景生成一个下拉列表。

我一开始只有 1 个下拉列表（有 5 个选项）=> 1,2,3,4,5 -> 默认选择第一个选项。我点击克隆按钮。
我选择选项 5（在选择列表 #2 中，即第一次单击按钮后生成的下拉列表。）
我再次点击克隆-> 新列表 (#3) 仅添加了选项 2、3、4
我选择选项 2（在选择列表 #3 中）
我点击克隆 -> 使用选项 3,4 创建新列表 (#4)
..等等。

一旦我到达最新的下拉列表，我想禁用之前所有的下拉列表实例（ddlCityName）。

例如：

进入下拉列表#2 后，我需要禁用下拉列表#1
对于下拉列表#3，我需要禁用下拉列表#1 和下拉列表#2
等等....

这是动态创建下拉列表的现有代码：

<body>
<form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>Category:</td>
                <td>
                    <asp:DropDownList ID="ddlCityName" runat="server" DataTextField="City" DataValueField="City" class="ddlClone"></asp:DropDownList>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <input type="button" id="btnClone" value="Add" />
                </td>
            </tr>
        </table>
    </div>
    <div id="target">
        <br />
        <br />
    </div>
</form>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $('#btnClone').click(function () {
        //$('#ddlCityName').append('<option selected="ddlClone" value="0">Select City</option>');
        var original = $('select.ddlClone:eq(0)');
        var allSelects = $('select.ddlClone');
        var clone = original.clone();

        $('option', clone).filter(function (i) {
            return allSelects.find('option:selected[value="' + $(this).val() + '"]').length;
        }).remove();
        $('#target').append($('<span>').text('Category: '));
        $('#target').append(clone).append('<br /><br /><br />');
    });
</script>

请分享你的想法！

【问题讨论】：

标签： javascript c# jquery asp.net

【解决方案1】：

在您的 btnClone 点击函数末尾添加以下代码。

$('.ddlClone').attr('disabled', false);
$('.ddlClone:not(:last)').attr("disabled", true);

【讨论】：

【解决方案2】：

document.getElementById("ddlCityName").setAttribute("disabled", "true");

【讨论】：

这样，在单击克隆按钮后，第一个被禁用，但是当我尝试对第二个下拉列表执行相同操作时，第二个下拉列表保持启用状态，第三个（刚刚创建) 加载 disabled.Anu 建议？
它按 ID 进行，因此引号中的任何 ID 都是将被选中的元素。此外，如果你想启用一个特定的人做同样的事情，但不是“真”在最后放“假”。
另外，如果你克隆一个禁用的元素，克隆可能也会被禁用。