jquery多個事件處理程序

Question

我已經根據我正在處理的最新項目中的類名來定義事件處理程序。

對於前 具有類名“foo”的所有元素應以特定方式響應change事件。 並且所有類名為“bar”的元素都應以其他方式響應。

現在我的一些元素屬於兩個類，即class =“foo bar”，它們應該以兩種方式響應。 現在，只調用了一個事件處理函數。

如何同時執行兩個響應。

Answer 1

這取決於你如何綁定事件。 如果你通過jQuery綁定它們而不是通過x.onchange = function() { ... }覆蓋處理程序 - 所有綁定的事件處理程序都將被執行。 這是因為jQuery將事件處理程序排隊 ，而不是覆蓋先前的綁定。

檢查這個fiddle ，看看多個事件被觸發 ：
和

檢查這個fiddle ，看看如何覆蓋事件處理程序，導致只觸發最后一個綁定的處理程序

Answer 2

你想要的是“行為”模式的變化。

它允許您自動處理具有給定類或其他屬性的元素上的事件。

通常的實現是監聽“document”上的事件，然后通過event.target定義動作。

例如：小提琴（ http://jsfiddle.net/PRkAr/ ）

$(document).on('click change', '.foo.bar', function(e) {
  var classes = this.className.split(/\s+/);
  $.each(classes, function(i, cls) {
    handle(e, this, cls);
  })
})

function handle(e, elem, cls) { 
  // example: Event type click on elem DIV with class foo
  alert("Event type " + e.type + " on elem " + elem.tagName + " with class " + cls);
} 

這里的函數句柄處理具有您選擇的類的元素的所有事件。 如果您想添加其他事件或類，只需將它們附加到“on”列表中即可。