延迟href执行点击直到ajax调用之后

Posted 2023-03-05

【中文标题】延迟href执行点击直到ajax调用之后

【英文标题】：Delay href execution click until after ajax call

【发布时间】：2015-01-02 22:31:45

【问题描述】：

在 Backbone 视图中，是否可以延迟对锚点 href 的单击执行，直到 ajax 调用完成？

我需要的是：

用户点击了一个href； 点击时触发ajax调用； 如果ajax调用成功，那么才应该执行href；

我做了一个测试，在 Backbone 视图中添加一个方法，链接到一个锚点：

    clickNext: function(e) 

        setTimeout(function()
            console.log("test"); 
        , 5000); 

不幸的是，href 是在超时完成之前执行的。

我之所以需要这个，是因为我想开发一个向导，其中每个页面都有一个单独的 url；我在每次页面加载时检查本地存储，并在每次单击“下一步”时执行持久存储 (Ajax)。

【问题讨论】：

您可以阻止默认事件处理，然后通过js打开href。虽然如果延迟太大，我相信浏览器弹出窗口拦截器会被触发。 （也许不是location）

【参考方案1】：

为了防止原来的点击触发位置改变使用e.preventDefault()然后你可以使用done或success回调，当ajax调用成功时，手动改变窗口hash位置。

myApp.Views.ExampleView = Backbone.View.extend(
    el: "#myView",
    events: 
        "click a": "handleLink"
    ,
    handleLink: function (e) 
        e.preventDefault();
        var link = $(e.currentTarget).attr('href');
        $.ajax("/echo/json/")
            .done(function () 
            location.hash = link
        )
    
);

var myView = new myApp.Views.ExampleView();

小提琴 - http://jsfiddle.net/leighking2/hjcg77h2/