在自身和 setTimeout 中解除绑定 "DOMSubtreeModified"

Question

我有以下问题：

setTimeout(function() {
    myElement.bind("DOMSubtreeModified", function() {

      if (something == true) {
        console.log("Keep outputting this message");
      } else {
        console.log("Unbind event");
        myElement.unbind("DOMSubtreeModified");
      }
    });
  }, 3600);

由于某些原因，解除绑定不起作用，它会在更改 myElement 后不断重新启动关联函数。

我确实在控制台中反复看到 "Unbind event" 消息一次 something != true

Answer 1

我认为 bind 和 unbind 不再被推荐。尝试使用 on/off 代替：

setTimeout(function() {
    myElement.on("DOMSubtreeModified", function() {

      if (something == true) {
        console.log("Keep outputting this message");
      } else {
        console.log("Unbind event");
        myElement.off("DOMSubtreeModified");
      }
    });
  }, 3600);

我也不确定 jQuery 是否正确处理了这个用例。您正在删除事件处理程序，而 jQuery 仍然 "waiting" 以便处理程序执行并获取其结果。您可以异步解除绑定，让事件处理程序执行先完成：

setTimeout(function() {
    myElement.on("DOMSubtreeModified", function() {

      if (something == true) {
        console.log("Keep outputting this message");
      } else {
        console.log("Unbind event");
        setTimeout(function() {
          myElement.off("DOMSubtreeModified");
        }, 10);
      }
    });
  }, 3600);

您可以防止此事件被多次绑定（推荐）：

function handleDOMChange() {
  if (something == true) {
    console.log("Keep outputting this message");
  } else {
    console.log("Unbind event");
    this.unbind("DOMSubtreeModified");
  }
}
// ....
setTimeout(function() {
  if(-1 == $.inArray(handleDOMChange, button.data('events').DOMSubtreeModified) {
    myElement.bind("DOMSubtreeModified", handleDOMChange);
  } else {
    console.warn("DOMSubtreeModified already bound!");
  }
}, 3600);

在自身和 setTimeout 中解除绑定 "DOMSubtreeModified"

issue unbinding "DOMSubtreeModified" within itself and setTimeout

javascript

jquery

events

bind

unbind