Question

我正在尝试制作一个淡出图像的功能，然后更新img的来源，这样当它淡入时它看起来像一个新的img，这是我必须这样做的代码：

var nextImg = function(event){
        event.preventDefault();
        //get current img and next img
        var currentImg = $('.current-img-li');
        var nextImg = $('.current-img-li').next();        
        //check if is not last element
        if(nextImg.length === 0){
            //if it is the last img in the list go to the first img
            $('.big-img-img').fadeOut(750);
            $('.big-img-img').attr('src', '');
            console.log('fade out start');
            currentImg.removeClass('current-img-li');
            $('.img').first().addClass('current-img-li');
        }else{
            //go to the next img
            $('.big-img-img').fadeOut(750);
              $('.big-img-img').attr('src', '');
            currentImg.removeClass('current-img-li');
            nextImg.addClass('current-img-li'); 
        }
        //update the main img with the above source
        var selctedImg = $('.current-img-li').find('img').attr('src');
        $('.big-img-img').attr('src', selctedImg);
        $('.big-img-img').fadeIn(750);
    };

我遇到的问题是事件的顺序应该是 1）淡出.big-img-img 2）更新.big-img-img的来源 3）淡入.big-img-img 但我屏幕上的当前事件是： 1）更新源 2）淡出 3）淡入我曾尝试在更新源中添加延迟但这并没有解决它？有任何想法吗？

jquery事件没有按正确的顺序显示

0 个答案: