jQuery $ .change函數不適用於克隆選擇

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>的選定值，則該函數會將所有選定的選項添加到數組中，並禁用select中的每個選定選項，但選中該值本身的框中除外（如果我在“ select”中選擇了“ 2”在第一個方框中，“ 2”在所有其他方框中均被禁用​​）。

Answer 1

因為您的select元素是動態的（在初始頁面加載后添加到DOM，或者將其添加到DOM； 在初始事件處理程序附件之后添加到DOM），所以您需要委派change事件處理程序：

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

});

但是，您不希望使用document ，而是將事件處理程序附加到最接近.variable_priority靜態元素。

的jsfiddle

Answer 2

我認為代碼未在新克隆上執行。

此腳本在啟動時加載。 它必須為每個新的子代完成。。也許添加一個新子代之后，運行專門針對該新子代的腳本。