在 jQuery 之后延迟 link

Question

因为我想在用户单击 link 时显示一个短动画，所以我想在重定向之前确保动画完成。为此，我想我可以设置一个简单的超时来跟随 link，像这样：

$("a[href^='http://'], a[href^='https://']").click(function(e) {
    setTimeout(function() {
        window.location.href = $(this).attr("href");
    }, 1200);
    console.log($(this).attr("href"));
    e.preventDefault();
});

显然不是。虽然我不明白为什么。 console.log 没有被调用，但我很确定我的选择器是正确的。我在这里错过了什么？

Fiddle.

Answer 1

它看起来像是 jQuery edge 中加载方法中的错误，如果您看到下面的代码，它正在调用 off = url.indexOf(" ")，但是当 $(window).load(function(){}) 的值 url 是一个没有 indexOf 属性.

的函数

jQuery.fn.load = function( url, params, callback ) {
    if ( typeof url !== "string" && _load ) {
        return _load.apply( this, arguments );
    }

    var selector, type, response,
        self = this,
        off = url.indexOf(" ");

    if ( off > -1 ) {
        selector = jQuery.trim( url.slice( off ) );
        url = url.slice( 0, off );
    }

    // If it's a function
    if ( jQuery.isFunction( params ) ) {

        // We assume that it's the callback
        callback = params;
        params = undefined;

    // Otherwise, build a param string
    } else if ( params && typeof params === "object" ) {
        type = "POST";
    }

在 jsfiddle 中，您可以看到类似 Uncaught TypeError: url.indexOf is not a function 的错误。这是因为默认情况下 jQuery 将脚本添加到 dom 就绪处理程序中。如果您将脚本位置更改为 head/body 然后使用下面给出的 dom 就绪处理程序，它工作正常

jQuery(function($){
    $("a[href^='http://'], a[href^='https://']").click(function(e) {
        setTimeout(function() {
            window.location.href = $(this).attr("href");
        }, 1200);
        console.log($(this).attr("href"));
        e.preventDefault();
    });
})

演示：Fiddle