Question

这是我写的封面：

var slider = (function(){
    var count = 3;
    return function(){
        if (count>0) {
            $("#message").html("<h1>"+count+"</h1>");
            count--;
            $("#message").removeClass("animated zoomIn");
            $("#message").addClass("animated zoomIn");
            $("#message").one("webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend",  function(){
                return slider();
            }());   
        } else{
            showCube();
        }
    }()
});

此闭包由jquery插件执行：

$("#fishes").addClass("animated slideOutLeft").one("webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend", slider());

但是，回调没有被执行。有人可以指导我正确的方向吗？

Answer 1

我阅读它的方式，你希望slider()返回一个可用于one的闭包。但是 - 它没有，因为你的代码会受到过早执行综合症的影响。

您的slider函数创建一个闭包，然后立即执行它，然后返回该执行的结果。由于内部闭包没有return语句，因此从slider()返回的值为undefined，而one并未获得任何附加处理程序。

解决方案：从倒数第二行删除()。这应该使slider()返回一个闭包而不是结果。

编辑：您的function() { return slider(); }()相当于slider()，后者构建了count为3的新闭包。将其替换为arguments.callee，以提供正在执行的相同闭包。

＆＃13;

var slider = (function(){
    var count = 3;
    return function(){
        if (count>0) {
            $("#message").html("<h1>"+count+"</h1>");
            count--;
            $("#message").one("click", arguments.callee);   
        } else{
            alert("The End");
        }
    }
});
$('#message').one('click', slider());

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="message">Click me!</div>

＆＃13;

或者，您可以为其命名，因此您可以直接引用它：

＆＃13;

var slider = (function(){
    var count = 3;
    return function sliderClosure(){
        if (count>0) {
            $("#message").html("<h1>"+count+"</h1>");
            count--;
            $("#message").one("click", sliderClosure);   
        } else{
            alert("The End");
        }
    }
});
$('#message').one('click', slider());

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="message">Click me!</div>

＆＃13;

JavaScript关闭回调本身

1 个答案: