如何使用jQuery click事件基于JSON查询异步更改href值

我正在使用bit.ly url缩短服务来缩短某些url被发送到“在twitter上分享”function。 我只想在用户实际按下共享按钮时加载bit.ly url（由于bit.ly的最大5个并行reqs限制）。 Bit.ly的REST API使用缩短的url返回JSON回调，这使整个场景异步。

我已尝试以下方法来停止click事件，并等待JSON调用在启动单击之前返回一个值。

我在jQuery（document）.ready（）中有以下简化代码：

更新的代码（过度简化）！

jQuery("#idofaelement").click(function(event) { event.preventDefault(); //stop the click action var link = jQuery(this); bitlyJSON(function(shortUrl) { link.attr("href", function() { //process shortUrl //return finalized url; }).unbind().click(); }); }); 

并使用以下代码来处理缩短的缩短（工作得很好）：

 function bitlyJSON(func) { // // build apiUrl here // jQuery.getJSON(apiUrl, function(data) { jQuery.each(data, function(i, entry) { if (i == "errorCode") { if (entry != "0") { func(longUrl);} } else if (i == "results") { func(entry[longUrl].shortUrl);} }); }); } (jQuery) 

href的值已更改，但最终的.click（）事件永远不会被触发。 这在为href定义静态值时工作正常，但在使用异步JSON方法时则不行。

Answer 1

如您所述：

 event.preventDefault(); //stop the click action 

这意味着， 浏览器不会访问该URL ，如果您希望实际前往长url，只需执行以下操作：

 document.location.href = longurl; 

Answer 2

iirc，jquery不会触发A元素的“点击”。 我会在回调中尝试旧的“location.href = whatever”。

  bitlyJSON(function(shortUrl) { link.attr("href", function() { //process shortUrl //return finalized url; }); location.href = link.attr("href"); }); 

Answer 3

我认为你真正想要的是return false; 来自click事件，以防止实际跟随href，对吧？

喜欢：

 jQuery("#idofaelement").click(function(event) { //event.preventDefault(); //stop the click action var link = jQuery(this); bitlyJSON(function(shortUrl) { link.attr("href", function() { //process shortUrl //return finalized url; }).unbind().click(); }); return false; }); 

Answer 4

@Tzury Bar Yochay通过建议我使用location.href更新url，向我指出了正确的方向。 @Victor帮助他回答了问题。

我把各种答案结合起来，但是在firefox中遇到了历史问题。 似乎更新window.location确实重定向了用户，但也从历史记录中删除了“源页面”。 这不会发生在chrome，safari，ie8，ie8-compatibility或ie7中。

根据对另一个问题的回复，我能够创建一个解决方法，给出以下工作代码+进行了一些更改：

 jQuery("#idofaelement").one("click", function(event) { bitlyJSON(function(shortUrl) { jQuery("#idofaelement").attr("href", function() { //process shortUrl //return finalized url; }); setTimeout(function() { window.location = jQuery("#idofaelement").attr("href"); }, 0); }); return false; }); 

感谢您的帮助！