延迟单击链接

Question

这是我正在使用的小提琴：http://jsfiddle.net/Scd9b/

单击后如何延迟href函数？

例如，用户单击链接，消息向下滑动片刻，2秒钟后，用户继续到其链接到的页面。

很抱歉大家都忘了提到有一些主播没有链接。

Answer 1

您可以通过设置window.location来模拟导航到页面。因此，我们将用preventDefault阻止链接的正常功能，然后在setTimeout中，我们将设置正确的window.location：

https://codepen.io/anon/pen/PePLbv

$("a.question[href]").click(function(e){
    e.preventDefault();
    if (this.href) {
        var target = this.href;
        setTimeout(function(){
            window.location = target;
        }, 2000);
    }
});

Answer 2

检查这个小提琴：http://jsfiddle.net/C87wM/1/

修改你的切换方式如下：

$("a.question[href]").click(function(){
    var self = $(this);
    self.toggleClass("active").next().slideToggle(2000, function() {
        window.location.href = self.attr('href'); // go to href after the slide animation completes
    });
    return false; // And also make sure you return false from your click handler.
});

Answer 3

取消单击并使用setTimeout更改位置。

$(document).ready(function(){
    $("span.answer").hide();
    $("a.question").click(function(e){
        $(this).toggleClass("active").next().slideToggle("slow");
        e.preventDefault();
        var loc = this.href;
        if(loc){
            window.setTimeout( function(){ window.location.href=loc; }, 2000 );
        }
    });
});

Answer 4

$(document).ready(function(){
    $("span.answer").hide();
    $("a.question").click(function(e){
        e.preventDefault();
        $(this).toggleClass("active").next().slideToggle("slow");
        var Link = $(this).attr("href");
        setTimeout(function()
        {
             window.location.href = Link;
        },2000);
    });
});

Answer 5

首先阻止链接的默认操作。然后添加2秒的超时，之后页面将重定向到链接的href属性中的url。

$("a.question").click(function(e){
    e.preventDefault();
    $(this).toggleClass("active").next().slideToggle("slow");
    setTimeout(function(){
        location.href = $(this).prop("href");
    }, 2000);
});

示例。

Answer 6

点击处理程序中的e.preventDefault怎么样。然后执行setTimeout，将您带到目的地？

$("a.question").click(function(e){
    e.preventDefault();
    $(this).toggleClass("active").next().slideToggle("slow");
    setTimeout('window.location.href=' + $(this).attr(href), 2000);
});

Answer 7

这应该做到：

$("a[href]").click(function () {
    var url = this.href;
    setTimeout(function () {
        location.href = url;
    }, 2000);
    return false;
});

Answer 8

设置窗口位置对我来说不是个好主意，所以我做了以下

点击时，它会检查用户是否点击了链接，如果是，它会等待2秒，然后再次触发点击，因为它不是用户触发的，所以这次不会等待

document.getElementById("question").addEventListener("click", function(e) {
 //if user clicked prevent default and trigger after 2 seconds
 if(e.isTrusted) {
 	e.preventDefault();
  
  //after 2 seconds click it and it'll not wait since it's not user triggered 
  setTimeout(function() {
     e.target.click();
  }, 2000);
 }
});

<a href="https://www.bing.com" id="question">Bing</a>