Question

我有一个侦听＆＃34; mouseenter＆＃34;事件，并在5秒后触发libraryFunction（我无法编辑）（使用setTimeout实现）。

但是，如果用户在5秒内单击div，则应取消setTimeout，并且不应运行该函数（使用clearTimeout实现）。单击还将删除libraryFunction所依赖的元素。

目前我有以下代码：

var timeoutVar;
$("#mydiv").on("mouseenter", function(event) {
    timeoutVar =  setTimeout(function() {
        runLibraryFunction(object);
    }, 5000);
});

$("#mydiv").on("click", function(event) {
    clearTimeout(timeoutVar);
    removeObject(object);
});

这在很大程度上起作用，但是，在5秒之后单击div并且在执行runLibraryFunction（）时存在边缘情况。因为＆＃34;点击＆＃34; event删除了runLibraryFunction需要的对象，这在runLibraryFunction运行时发生，runLibraryFunction然后抛出错误。

有没有办法在触发后停止runLibraryFunction（）调用？

Answer 1

棘手但会奏效

timeoutVar =  setTimeout(function() {
        setTimeout(function(){ 
            if(object)
            runLibraryFunction(object);
        },1000);
    }, 5000);

保持休息。

或使用立即调用的函数

timeoutVar =  setTimeout(function() {
                  (function(object){ 
                      runLibraryFunction(object);
                   })(object);
              }, 5000);

现在可以随时访问对象

Answer 2

您可以在启动库函数时向对象添加属性，从而保护它不被删除，如：

var timeoutVar;
$("#mydiv").on("mouseenter", function(event) {
    timeoutVar =  setTimeout(function() {
        object.keepmealive=1;
        runLibraryFunction(object);
        if (object) delete object.keepmealive;
    }, 5000);
});

$("#mydiv").on("click", function(event) {
    clearTimeout(timeoutVar);
    if (!object.keepmealive) removeObject(object);
});

这种方法假设您的库函数将以某种方式处理删除或执行object所需的任何操作，因此一旦它开始运行，就不再需要删除函数了。它将保持原状，并准备好应对未来可能发生的其他事件。

Answer 3

我会在处理过程中取消绑定事件，然后使用s递归函数重新绑定它，如下所示：

var timeoutVar;
var init = function(){
  $("#mydiv").on("mouseenter", function(event) {
    timeoutVar =  setTimeout(function() {
        $("#mydiv").off()
        runLibraryFunction(object, function(){
          init()
        });
    }, 5000);
  });
};

$("#mydiv").on("click", function(event) {
    clearTimeout(timeoutVar);
    removeObject(object);
});

init();

如何在setTimeout触发后停止Javascript函数调用？

3 个答案: