0

我有一些 Jquery 可以不停地放大和缩小横幅图像。当我运行它时，我在浏览器中收到堆栈限制错误。它仍在运行，但有没有办法让它“及时”加载到堆栈中？当查看它加载的堆栈时，它会在初始加载zoomIn()时zoomOut()一遍又一遍地加载，直到达到限制，因此页面加载非常慢。

$(document).ready(function(){

    $bannerImg = $('.post-picture img')

    function zoomIn(){
        $bannerImg.animate({
            width: 1500,
        }, 50000,'linear');

        $bannerImg.promise().done(zoomOut());
    }

    function zoomOut(){
        $bannerImg.animate({
            width: 1500,
        }, 50000,'linear');

        $bannerImg.promise().done(zoomIn());
    }

    zoomIn();

});

更新：感谢您的回答。使用 done(ZoomOut/ZoomIn) 有效。

4

3 回答 3

4

您正在调用该函数，.done()而不是将其作为参数传递。

$bannerImg.promise().done(zoomOut());

应该

$bannerImg.promise().done(zoomOut);

和

$bannerImg.promise().done(zoomIn());

应该

$bannerImg.promise().done(zoomIn);
于 2013-05-09T19:27:08.693 回答
4

.done()需要一个函数引用——一旦 promise 对象被解析，函数传递就会被执行。相反，您只是调用函数（undefined无论如何都不会返回任何内容）。如果你这样做，函数将不断地相互调用，就像一个无限循环。用这个：

$bannerImg.promise().done(zoomOut);
// and later:
$bannerImg.promise().done(zoomIn);

演示：http: //jsfiddle.net/G6uWs/

（我不得不更改数字以使其可用）

参考：

于 2013-05-09T19:27:16.070 回答
0

看起来你正在导致无限循环。幸运的是，jQuery 有一个完整的回调，您可以利用它来防止无限循环。

不间断放大和缩小横幅

$(document).ready(function () {

    $bannerImg = $('.post-picture img');

    function zoomIn() {
        $bannerImg.animate({
            width: 1500
        }, {
            duration: 10000,
            complete: function () {
                zoomOut();
            }
        });
    }

    function zoomOut() {
        $bannerImg.animate({
            width: 100
        }, {
            duration: 10000,
            complete: function () {
                zoomIn();
            }
        });
    }

    zoomIn();

});

*来源：* jsfiddle

于 2013-05-09T19:38:19.303 回答