将jquery remove方法设置为动画完成时的回调不起作用

Question

我正在做一个小游戏,在这个游戏中,我需要经常发生灾难.这场灾难必须动摇我的MainFrame元素并删除类.House,建筑数组和DOM中的所有元素.

这段代码在一定程度上起作用,问题是它不会从DOM中删除元素,只能从数组中删除.你能帮我搞定吗？我第一次使用这个网站,所以我希望我没有留下任何相关内容.

setInterval(function() {

    var iDisasterChance = getRandomNumber(1, 12);

    if (iDisasterChance === 1)
    {
        $(".MainFrame").effect("shake", {times: 8}, 4000);
        //$(".House").effect("explode", {pieces: 24}, 4000);
        $(".House").effect("explode", {pieces: 24}, 4000,  $(".House").remove); // TODO: bug - leaves elements in the dom
        //$(".House").remove();
        oCity.aBuildings.length = 0;
        console.log(iDisasterChance +' of 12');
        console.log('*** DISASTER ! AVOIDED ***');
        console.dir(oCity.aBuildings);
        return false;
    }
    else
    {
        console.log(iDisasterChance +' of 12');
        console.log('*** DISASTER AVOIDED ***');
    }
}, 10000);

Answer 1

试试这种方式.你需要remove()不remove和回调,因为你失去remove方法中的jQuery对象的上下文.

$(".House").effect("explode", {pieces: 24}, 4000,  function(){
    $(this).remove(); //now this will get executed once your animation effect is complete and this represents the .House where the effect happened.
});

如果你想要remove所有.House那么它一定是.

$(".House").effect("explode", 
                              {pieces: 24}, 4000, 
                              $(".House").remove.bind($(".House"))); //bind will set the context to that of .House.

要么

   $(".House").effect("explode", {pieces: 24}, 4000,function(){
          $(".House").remove();
   });

你这样做的原因:

$(".House").effect("explode", {pieces: 24}, 4000,  $(".House").remove));

OfCourse的remove方法将与上下文最有可能的是的回调来设置DOMelement,而不是jquery object(如你在常规回拨为WEEL看到你this的DOM元素,它并没有删除方法的jQuery的版本).所以你可以使用任何一个function.bind来绑定上下文,$.proxy或者只是在回调中使用它.