javascript - preventDefault 在淡出后不起作用然后加载然后将新的 href 内容淡入到 div

Question

我已经搜索和搜索，似乎没有什么能真正回答我正在寻找的东西。

我正在将html页面拉入一个div。我终于让它淡出，加载新的href内容，然后淡入新的内容。但是，我无法阻止链接上的默认值。

这是我的代码。任何帮助是极大的赞赏！

$(document).ready(function() {

var url = $(this).attr("href"); 

$('#container').css('display', 'none');

$('#container').fadeIn(1000);

jQuery('a').click(function(e){
e.preventDefault();
$('a').removeClass('current');
$(this).addClass('current');    
$("#container").fadeOut('1000',function(){
$('#container').load(url);
}).fadeIn('1000');

        });

    })

Answer 1

您需要fadeIn在加载回调中调用它。

$(document).ready(function() {
    var loading = false;
    $('#container').css('display', 'none');
    $('#container').fadeIn(1000);

    $('a').click(function(e){
            if(loading) return false;
        e.preventDefault();
            loading = true;
        var url = $(this).attr("href"),
            cont = $("#container");  //cache selector
        $('a').removeClass('current');
        $(this).addClass('current');    
        cont.fadeOut(1000, function(){
            cont.load(url, function() {
                cont.fadeIn(1000, function() {
                    loading = false;
                });
            });
        });

    });
});