javascript - 仅在执行某些事件后才打开链接中的 href

Question

我有一个指向 Tumblr 共享小部件的链接，需要在打开之前向其附加一些查询字符串参数(通过单击链接触发)。然而，链接在附加这些参数之前打开，我想是因为这需要几秒钟——我正在页面上发送要托管在 imgur 上的图像并返回该 URL。

有什么办法可以延迟新链接的打开，直到我的新图像网址返回后？？？我尝试过使用 e.preventDefault(); 和 return false; 但没有任何运气。

我的 HTML 是:

<button id='tumblrshare'>tumblr</button


$('body').on('click','#tumblrshare',function(e){
var svg = $("#svg")[0];
svg.toDataURL("image/png", {
    callback: function(img) {
    var img = img.replace("data:image/png;base64,", "");
    var imgurTitle = $("meta[property='og:title']").attr("content");
    $.ajax({ 
          url: 'https://api.imgur.com/3/image',
          headers: {'Authorization': 'Client-ID **********'},
          type: 'POST',
          data: {'image': img, 'type': 'base64', 'title': imgurTitle},
          success: function(result) { 
          imageURL = result.data.link;
          window.location = 'https://www.tumblr.com/widgets/share/tool?canonicalUrl=http://www.example.com&caption=mycaption&posttype=photo&content=' + imageURL;
          },
          error: function(){
            console.log('error');
          }
    }); //ajax
  }//callback

});//svg

}); //tumblrshare

请帮忙!!

Answer 1

一旦点击链接，更改链接的“href”属性就不会更改其目的地。当 ajax 调用完成时，请考虑使用 window.location 重定向用户。

$('body').on('click','#tumblrshare',function(e){
   e.preventDefault(); // Stop the default behaviour
   ...
   $.ajax({
    success: function(result){
      window.location = result.data.link;
    },
    ...
  });
...
});