Question

我想为两个不同的事件发射同样的动作。我遇到的问题是其中一个事件引发了另一个事件。我正在使用javascript和Mootools，事件也设置在'input'元素上，该元素位于td单元格内。

我想在元素失去焦点（onBlur）时以及当用户按下'Enter'键（onKeypressed）时触发动作'保存'。问题来自于“保存”动作引发了“onBlur”事件。因此，当我按下“输入”时，保存操作将执行2次，并从脚本中创建不需要的行为。

这是“保存”功能（'this'代表输入元素）

storeUpdt(this); this.getParent().appendText(this.value); this.getParent().addEvent(....); this.destroy();

所以，如果您有任何想法，谢谢！

Answer 1

您始终可以使用互斥锁来阻止第二个事件处理程序。

function fireSave(event) {
  if (this._saving) {
    return;
  }
  try {
    this._saving = true;
    // do whatever stuff
  }
  finally {
    this._saving = false;
  }
}

function onKeyPressed(event) {
  // make sure the pressed key is ENTER
  fireSave();
}

var input = document.getElementById('whatever_input_id');
input.addEventHandler('blur', fireSave, false);
input.addEventHandler('keypressed', onKeyPressed, false);

Answer 2

我知道，这显然是过度设计的，但我倾向于只有1个事件处理程序，然后使用另一个来调用第一个。

例如：http://www.jsfiddle.net/dimitar/VaZGC/

var input = document.id("myinput"), output = document.id("output"), saveValues = function(what) {
    output.set("html", what);
};

input.addEvents({
    blur: function() {
        saveValues(this.get("value"));
    },
    keyup: function(e) {
        if (e.key == "enter") {
            this.blur(); // this will be just fine.
        }
    }
});

你也可以.fireEvent("blur", event)但这里不实用，因为虽然它会调用saveValues，但它不会模糊，然后在模糊时会再次运行它。

Answer 3

实际上我发现按键事件触发有很多不同的行为，具体取决于浏览器！当时我正在使用Chrome，并且“输入按键按火模糊事件”的技巧不起作用，但是使用Opera它工作得很好。

所以我最终决定使用Mootools特定的按键事件管理器，它适用于任何浏览器（包括'Tab'事件！）。希望它会有所帮助！

Javascript双重事件解雇不需要

3 个答案: