如何阻止jquery为每个类成员运行一次脚本?

How can I stop jquery from running a script once for each class member

本文关键字:一次 脚本 运行 成员 jquery 何阻止      更新时间:2023-09-26

我有以下代码:

function fadeIn()
    {
    $(".home_photo").fadeTo(1000, 1.0 ).delay(5 * 1000);
    fadeOut();
    }
function doSwap()
    {
    console.log('Swap');
    ... There is some Ajax Code here that swaps the image in the divs ...
    fadeIn();
    }
function fadeOut()
    {
    $(".home_photo").fadeTo(1000, 0.01, doSwap );
    }
$(document).ready(function(){
    fadeOut();
});

下面是相应的HTML:

<body>
<div id="photowrapper">
    <div class="home_photo" id="img1"></div>
    <div class="home_photo" id="img2"></div>
    <div class="home_photo" id="img3"></div>
    <div class="home_photo" id="img4"></div>
</div>
</body>

jQuery脚本对"home_photo"类的每个成员运行一次。问题是doSwap函数在每个交换周期(fadeOut, doSwap, fadeIn)中运行4次。我需要做些什么,使脚本只运行一次每次交换,而不是一次为每个类成员?

如果你想让doSwap()fadeTo()完成后运行,你可以使用jQuery延迟对象来控制进程:

$.when(function() {
    var deferred = $.Deferred();
    $(".home_photo").fadeTo(1000, 0.01, function(){
        deferred.resolve();
    });
    return deferred;
}).then(function(){
    doSwap();
});