为什么 jQuery Asual Address 插件会触发更改事件两次？

发布于 2024-10-19 06:09:13 字数 788 浏览 2 评论 0原文

您好，

我正在使用 jQuery Asual Address 插件： http://www.asual.com/jquery/地址/

由于某种原因，在 Firefox 和 IE（但不是 Chrome）中，当参数之一是 url（以“http://”开头）时，地址更改事件会触发两次。

单击“foo”链接展示了我的问题。非常感谢任何帮助。

代码：

$(function() {
    $('a').click(function(e) {
        e.preventDefault();
        $.address.value($(this).attr('href'));
    });
    var changecount = 0;
    $.address.change(function(event) {
        $('span').html(changecount++);
    });
});

<a href="?u=http://foo.bar">foo</a><br />
<a href="?u=foo.bar">bar</a><br />
<span></span>

原文

Greetings,

I'm using the jQuery Asual Address plugin: http://www.asual.com/jquery/address/

For some reason, in Firefox and IE (but not Chrome), the address change event is firing twice when one of the parameters is a url (starts with "http://").

Here's a fiddle with an example: http://jsfiddle.net/5L6Ur/

Clicking on the "foo" link demonstrates my problem. Any help is greatly appreciated.

Code:

$(function() {
    $('a').click(function(e) {
        e.preventDefault();
        $.address.value($(this).attr('href'));
    });
    var changecount = 0;
    $.address.change(function(event) {
        $('span').html(changecount++);
    });
});

<a href="?u=http://foo.bar">foo</a><br />
<a href="?u=foo.bar">bar</a><br />
<span></span>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

雨后咖啡店 2024-10-26 06:09:13

尝试使用internalChange 和externalChange 函数。

http://jsfiddle.net/5L6Ur/9/

回复收藏 0 原文

牵你的手，一向走下去 2024-10-26 06:09:13

我解决此问题的方法是设置 searching 变量。

像这样：

$(function () {
  var searching = false;
  $('form.ajaxified').live('ajax:beforeSend.rails', function(){
    $.address.value('?' + $('form.ajaxified').serialize());
    searching = true;
  });
  $('form.ajaxified').live('ajax:complete.rails', function(){
    searching = false;
  });
  $.address.externalChange(function(event) {
    if (!searching) {
      $('form.ajaxified').submit();
    }
  });
});

当我作为用户触发它（通过提交表单）时，这可以防止双重ajax请求，但当我点击后退按钮或重新加载页面时运行它。希望有帮助。

PS 这些事件是特定于 Rails 的，但可以使用 JQuery Ajax 回调来完成相同的操作。

My workaround for this the problem is setting the searching variable.

something like:

$(function () {
  var searching = false;
  $('form.ajaxified').live('ajax:beforeSend.rails', function(){
    $.address.value('?' + $('form.ajaxified').serialize());
    searching = true;
  });
  $('form.ajaxified').live('ajax:complete.rails', function(){
    searching = false;
  });
  $.address.externalChange(function(event) {
    if (!searching) {
      $('form.ajaxified').submit();
    }
  });
});

This prevents the double ajax requests when I trigger it as a user (by submitting a form) but runs it when I hit back button or reload the page. Hope that helps.

PS The events are rails specific, but the same could be accomplished using JQuery Ajax calbacks.

回复收藏 0 原文

揽清风入怀 2024-10-26 06:09:13

我花了很多时间来解决同样的问题。我已经缩小了原因，但除了回避之外我没有其他解决方案。该问题是由您在示例中创建的哈希值中的“=”引起的。我猜测这个问题与插件执行的解析有关，因为我用许多常见的分隔符（“=”、“&”、“|”、“:”、“;”重新创建了问题））。您可以通过将这些麻烦的字符替换为其他字符（我使用“/”和“.”）来避免双重触发问题。

这是我所看到的症状的更具体解释。 IE 和 Firefox 中都会使用 .change() 方法或 .externalChange() 和 .internalChange 方法的组合来双重触发更改事件。如果使用 .change() 方法，则不会真正指示发生了什么，但使用内部和外部方法可以让您更深入地了解问题。内部更改事件似乎表现正常，仅在触发事件实际上是内部时触发。然而，外部事件似乎一直在触发，无论触发事件是内部的还是外部的。结果是外部事件“正确”触发，这意味着仅触发 externalChange() 方法。内部事件“不正确地”触发，导致双重触发——internalChange() 方法按预期触发，但 externalChange() 方法也会触发。

希望这有帮助。

回复收藏 0 原文