JQuery onchange多個元素，但只觸發一次

我在HTML頁面中有很多選擇框，並且我已經使用相同的類名「paperGSM」用於所有選擇元素和一個觸發選擇框元素更改的功能值。JQuery onchange多個元素，但只觸發一次

var getPaperTypeFromGSM = function() 
{ 
    $('div').off().on('change', '.paperGSM', function() 
    { 
     console.log($(this).val()); 
     var url = 'api/getPaperTypeFromGSM'; 
     var postData = { 
      paperGSM: $(this).val() 
     }; 
     var $current = $(this); 
     $.post(url, postData, function (result) 
     { 
      if (result.result == 1) { 
       var output = ""; 
       output += '<option value="0">Select Paper Type</option>'; 
       for (var i = 0; i <result.paperType.length; i++) { 
        output += '<option value="' + result.paperType[i].paper_type_id + '">' + result.paperType[i].paper_type_name + '</option>'; 
       } 
       $current.siblings('.paperType').prop("disabled", false).html(output); 
       getPaperSizeFromPaperType(); 
      } else { 
       Result.error(result); 
      } 
     }, 'json'); 
    }); 
    return false; 
};

每次發生更改事件時，都會觸發多次（可能觸發所有具有相同類名的元素）。下面的圖片解釋了這種情況。

PS：我的邏輯，甚至後功能工作正常

因爲我不想硬編碼的所有元素的事件（如給所有元素不同的類名和硬編碼的功能全部），我只希望一個函數適用於所有相同的類元素，但只觸發一次。

如果我忽略多個觸發器，一切工作正常，它就是這樣，那件事很困擾我。

來源

2016-08-01 Vaibhav Sidapara

我敢打賭，這是因爲每次點擊按鈕時都會觸發onChange。鍵入12345觸發5 onChange事件 – Jay

我認爲原因是由於'eventBubbling'。（'change'，'.paperGSM'，function（event）{event.stopPropagation（）; //以及其他代碼..' –

嘿，停止嘗試這個'$（'div'）。 @The_ehT，這個東西有效，但事件不會觸發下一個選擇框，因爲我想爲多個選擇框選擇一個函數，但它應該只觸發一次 –

的原因是由於eventBubbling。要停止嘗試這個

$('div').on('change', '.paperGSM', function (event){ 
event.stopPropagation(); 
// ...and rest of your codes.. 
}

注意：刪除.off因爲一旦該事件被觸發時，它會刪除監聽器。

來源

2016-08-01 07:20:55

如果有人仍然需要這個，我找到了一個解決方法這通過使用onchange event和JQuery：

// The input: 
<input class="jscolor" onchange="set_boxes_color(this.jscolor)" value="cc66ff"> 

// The function: 
function set_boxes_color(picker) { 
    var elements = $(".p_box"); 
    for (var i = 0; i < elements.length; i++) { 
     elements[i].style.backgroundColor = '#' + picker; 
    } 
}

這將改變使用類的所有元素的背景顏色p_box

來源

2016-11-02 17:46:48

JQuery onchange多個元素，但只觸發一次

回答

相關問題