jQuery "tagging"事件

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