Question

我遇到了在jQuery中处理AJAX函数然后跟踪链接的问题。我有一个可以在jQuery('body').live('click', function(event) {});

之类的页面上任意点击的功能

此事件可能是或不是链接。在这个回调中我有jQuery.post();运行的东西。因此，任何时候点击事件发生在身体的任何地方都会运行。当此单击是链接或链接中的某种div时，我的问题就出现了。我尝试过这样的事情：

event.preventDefault();

接着是

if ( jQuery(event.target).attr('href').length ) { var url = jQuery(event.target).attr('href'); window.setTimeout(function(){document.location.href=url;}, 1000); // timeout and waiting until effect is complete }

但问题是，如果你有类似<a><div></div></a>的东西，这将无效。我的问题是......

是否有一种可靠的方法可以暂停链接，处理AJAX，然后继续关注链接？

Answer 1

一个解决方案：

$("a").live('click',function(e){
  e.preventDefault();
  var url = this.href;
  setTimeout(function(){
    location.href = url;
  },1000);
});

我只是想知道这是否会影响任何其他可能包含绑定事件的锚标记的wordpress插件。

编辑：要添加到此，您可能还需要确保请求是针对不同的页面：

$("a").live('click',function(e){
  var url = this.href;
  if (url == location.href) {
    return;
  }
  e.preventDefault();      
  setTimeout(function(){
    location.href = url;
  },1000);
});

Answer 2

这将是一个黑客攻击，但似乎您可以将所有链接目标更改为“＃”，然后使用真实目标创建另一个属性。捕获click事件，处理它，然后处理真实目标。您应该能够从jQuery / JavaScript代码执行此操作，而无需编辑实际的html。

Answer 3

如果执行淡入淡出（例如），则可以使用回调来跟踪链接。但一定要从你的onclick处理程序返回false，否则你将立即导航：

function onclickCallback() {
    $("#myelement").fadeOut(500, function() {
        window.location.href = "http://example.com/mynewpage";
    });
    return false;
}

最后，请用以下方式调用：

<a href="#" onclick="onclickCallback()">Click Me</a>

Answer 4

解决有关jQuery(event.target).closest('a').attr('href').length is undefined的错误。只需在第97行添加此行代码if ( jQuery(event.target).closest('a').attr('href')) { .....见下面它修复了错误：

    // Redirect if this is a link
    if ( jQuery(event.target).closest('a').attr('href')) {
        if ( jQuery(event.target).closest('a').attr('href').length ) {
            var url = jQuery(event.target).closest('a').attr('href');
            if ( jQuery(event.target).closest('a').attr('target') == '_blank') {
                window.setTimeout(function() 
                    { window.open(url, '_blank') },
                    window.name,
                    1000);
            } else {
                window.setTimeout(function(){document.location.href=url;}, 1000); // timeout and waiting until effect is complete 
            }           
        }
    }

无论如何，伟大的插件：）..

使用AJAX，然后按照链接

4 个答案: