javascript - 无法清除其他函数中调用的 inverval

Question

我不明白为什么这个变量对函数来说是私有(private)的，即使我尝试从控制台清除间隔，它也找不到该变量，我一定是在做一些愚蠢的事情。请帮忙，代码如下:我将其缩减为相关部分。

function attack() {
  $("#container").append("<div id='attacker' style='position:absolute; width: 128px; bottom:125px'>       <img src='attacker.gif' ></div>");
  $("#attacker").css("left", $( window ).width());
  attackerCheck = setInterval( function() { moveNclear("#attacker", "attackerCheck"); }, 33 );
}

function moveNclear(objectName, intervalname) {
  objectP = $(objectName).position();
  $(objectName).css("left", (objectP.left - 10) + "px");
  if(objectP.left < 0) {
    console.log("done");
    clearInterval(intervalname);
  }
}

Answer 1

您可以通过从 moveNclear() 进行适当的返回并在调用函数中测试它来避免传递间隔引用。

此外，$("#attacker")(很多次)效率非常低……而且是可以避免的。

最后，不要忘记使用 var 本地化变量。不要使用全局变量。

尝试:

function attack() {
    var $attacker = $("<div id='attacker' style='position:absolute; width:128px; bottom:125px'>       <img src='attacker.gif' /></div>").appendTo("#container").css('left', $(window).width());
    var attackerCheck = setInterval(function() {
        if(moveNclear($attacker)) {
            clearInterval(attackerCheck);
            console.log("done");
        }
    }, 33);
}

function moveNclear($el) {
    var pos = $el.position();
    pos.left -= 10;
    $el.css("left", pos.left + 'px');
    return (pos.left <= 0);//true:animation complete; false:animation in progress
}