jquery - 不要执行href jquery

Question

可能重复：
如果条件为假，则 Jquery 阻止默认

我有这段代码，它运行良好，但我希望它是动态的。

$(".nav a").click(function () {     
    var getid = $(this).attr('id');
    $("#background-wrapper").fadeOut("slow");
    $("#page_box").fadeOut("slow");         
    $("header").fadeOut("slow");
    $("footer").fadeOut("slow", function () {
        window.location = getid+".php";
    });
});

我想先执行淡出，然后再使用 href 引导它。

我想要的是这个

$(".nav a").click(function () {     
    var getid = $(this).attr('id');
    $("#background-wrapper").fadeOut("slow");
    $("#page_box").fadeOut("slow"); 
    $("header").fadeOut("slow");
    $("footer").fadeOut("slow");
});

然后触发这个之后

.nav a = href = "link"

Answer 1

您需要先使用event.preventDefault()停止链接行为，然后手动重定向用户。尝试这个：

$(".nav a").click(function (e) {     
    e.preventDefault();

    var getid = $(this).attr('id');
    $("#background-wrapper").fadeOut("slow");
    $("#page_box").fadeOut("slow");         
    $("header").fadeOut("slow");
    $("footer").fadeOut("slow", function () {
        location.assign = getid + ".php";
    });
});

Answer 2

尝试这个：

$(".nav a").click(function (e) {     

    e.preventDefault(); /*  If this method is called, the default action of the event will not be triggered. e.g clicked anchors will not take the browser to a new URL */

    var pageUrl = this.id + ".php";

    $("#background-wrapper").fadeOut("slow");
    $("#page_box").fadeOut("slow"); 
    $("header").fadeOut("slow");
    $("footer").fadeOut("slow", function () {
        window.location.replace(pageUrl);
    });

});

Answer 3

也许以下内容对您有用？

$(".nav a").click(function (e) {     
    e.preventDefault();
    var pageUri = $(this).attr('id') + '.php';
    $("#background-wrapper, #page_box, header, footer").fadeOut('slow', function () {
        window.replace(pageUri)
    });
}

Answer 4

试试这个：

$(".nav a").click(function (e) {   
    e.preventDefault();
    var $ele = $(this);
    $("#background-wrapper, #page_box, header, footer").fadeOut("slow", function () {
        window.location = $ele.attr('id')+".php";
    });
});