防止同一个触发器函数执行两次的最好方法是什么?

What is the best way to prevent the same trigger function from executing twice?

本文关键字:两次 方法 是什么 触发器 同一个 函数 执行      更新时间:2023-09-26

触发器可以应用于表单级和/或项级。让它而不是再次执行的最佳方式是什么?

<form id='f'>
  <input id='i' type='text' />
</form>
<script>
validate = function(e) { ... }
reformat = function(e) { ... }
document.getElementById('f').addListener('change',validate,true);
document.getElementById('i').addListener('change',validate,true);
document.getElementById('i').addListener('change',reformat,true);
</script>

上下文:数据字典说i项需要立即验证,应用程序编写人员说表单中的所有项都应该立即验证。

这是同一个函数,通常调用一次,但有时调用两次。

防止validate函数执行两次的最佳方法是什么?

注意:e.stopPropagation()停止所有click事件的进一步调用,因此不再调用reformat触发器。

你可以在event参数中添加一个prop来确保它只运行一次:

validate = function(e) { if (e.done) return; /* code */ e.done = true; }
document.getElementById('f').addListener('change',validate,true);
document.getElementById('i').addListener('change',validate,true);
<标题> 演示

虽然我不明白你为什么要绑定两次事件

编辑:对于跨浏览器(读:IE)更改为:

validate = function(e) {
    if ((e = e || window.event).done) return;
    /* code */ 
    e.done = true;
}
document.getElementById('f').addListener('change',validate,true);
document.getElementById('i').addListener('change',validate,true);
<标题>编辑演示

基本思路(基于http://www.quirksmode.org/js/events_order.html):

function cancelBubbling(e) {
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
}
var validate = function(e) {
    cancelBubbling(e); // important!
    ...
};