Question

我有一个带有按钮的表，通过克隆最后一行将一行添加到底部。每行包含一个名称不同的<select>（0-9），所有<select>个对象都有.variable_priority个类。当按下按钮时，行成功复制，我设法正确更改名称（10,11,12等），并且该行获得相同的类，因为它是完美的副本。

但是，当我执行以下函数时，遇到克隆表行的问题：

$('.variable_priority').change(function() {
    var selections = new Array();
    $(".variable_priority").each(function() {
        selections.push($(this).find('option:selected').val());
    });

    // Iterating on Options of Select
    $('.variable_priority').children('option').each(function() {
        $(this).removeAttr('disabled');

        if($.inArray($(this).val(), selections) !== -1){
            if($(this).val() != 0){
                if($(this).is(':selected')){
                    // nothing
                } else {
                    $(this).attr('disabled', true);
                }
            }
        }
    });
});

每次更改<select>的选定选项时，该函数都应该运行，尽管它只运行10个原始选项。当我更改克隆行中的选项时，不执行此功能。但是，如果我更改其中一个原始文件中的值，则该函数会运行，并且还会将克隆行中的值添加到selections数组中。

因此，由于某种原因，代码识别出克隆具有相同的类，但在更改其值时不会运行。

编辑：上述代码的简短描述;如果我更改<select>的选定值，该函数会将所有选定的选项添加到数组并禁用选区中的每个选定选项，但选择值本身的框除外（如果我选择＆＃39） ; 2＆＃39;在第一个框中，＆＃39; 2＆＃39;在所有其他框中被禁用）。

Answer 1

因为您的select元素是动态的（在初始页面加载后添加到DOM 中，或者是特定的; 在初始事件处理程序之后）附件）您需要委派您的change事件处理程序：

$(document).on('change', '.variable_priority', function() { });

不是使用document，而是要将事件处理程序附加到最接近.variable_priority的静态元素。

JSFiddle

Answer 2

我认为代码不会在新克隆上执行。

此脚本在启动时加载。它必须为每个新孩子做一遍。也许在添加一个新的后，运行这个特定于新的脚本。

jQuery $ .change函数无法使用克隆选择

2 个答案: