jQuery“標記”事件

Question

我不確定如何描述這一點，但是我將嘗試一些基本代碼：

<input type="text" id="num" placeholder="eg: 55"/>

假設我們添加了一些基本的過濾代碼：

$('.num').keyUp(function(){
    this.value = parseInt(this.value);
});

這就是最終開發人員的工作。 現在，讓我們假設他/她還使用了我們設計的表單驗證系統：

// ...
if(el.val()!=parseInt(el.val()))
    showError(el);
// ...

讓我們假設showError僅在用戶將鼠標懸停在其上時顯示工具提示：

function showError (el){
    el.css('border-color', 'red');
    el.mouseOver(function(){
        showErrorTooltip(this);
    });
}

效果很好，但是如果錯誤已解決怎么辦？ 使用jQuery，通常可以執行以下操作：

removeError(el);

此函數將從有問題的元素中刪除一些CSS內容，但最重要的是，它還將刪除我們的mouseOver事件，就像我們在上面添加的事件一樣：

function removeError(el){
    el.css('border-color': null); // default color
    el.unbind('mouseOver');
}

這很有效，直到最終開發人員需要使用jQuery的mouseOver將鼠標懸停在元素上時做一些浮華的工作。

問題是，我的removeError函數同時清除了我的事件以及開發人員的事件。

所以，我的最后一個問題是， 如何標記事件回調，以便可以有選擇地刪除它們？

---

如果上面的方法似乎沒有道理，那么這是一些偽代碼，說明結果可能是什么樣的：

就像是：

var tag_a = $('#a').click(function(){ alert('test1'); });
var tag_b = $('#a').click(function(){ alert('test2'); });
$('#a').unbind(tag_a);
$('#a').click(); // shows test2 only

Answer 1

您正在尋找的機制是事件名稱間隔： http : //docs.jquery.com/Namespaced_Events

您的示例：

el.bind('mouseOver.error', function() { ... })
el.unbind('mouseOver.error') //does not remove other mouse over events

Answer 2

我建議使用jQuery命名空間事件

Answer 3

您必須使用命名函數而不是匿名函數

function showError (el){
  var onMouseOver = function(){
    showErrorTooltip(this);
  });
  el.css('border-color', 'red');
  el.bind('mouseOver', onMouseOver);
}

function removeError(el){
  el.css('border-color': null); // default color
  el.unbind('mouseOver', onMouseOver);
}

這只會從mouseOver解除綁定此功能。 唯一的問題是onMouseOver函數必須由removeError看到，因為您沒有顯示整個代碼，所以我無法告訴您如何執行此操作。