JavaScript 函数破坏了我在 jQuery 地址爬行中的深层链接

Question

JavaScript 与 jQuery Address（插件）的奇怪行为。

我有这段代码：

var handler = function(data) {
$('#conteudo').hide().html($('#conteudo', data).html()).fadeIn(500);
$.address.title(/>([^<]*)<\/title/.exec(data)[1]);
};

它有效。完美。

现在我更改代码：

var handler = function(data) {
$('#conteudo').fadeOut(500, function() {
    $('#conteudo').html($('#conteudo', data).html()).fadeIn(500);
});
$.address.title(/>([^<]*)<\/title/.exec(data)[1]);
};

现在淡出效果有效，并且在淡入后（使用新内容）。美丽的！但是编写新内容的方式（在新函数内部，fadeOut 之后）的这个小变化破坏了我页面内的子链接。

这是一个实例：

1. 访问此 URL： http://impulse.im/clean/2/
2. 在顶部菜单中，单击“Contato”。
3. 现在查看加载内容中链接“Rafa”的 href！
   http://impulse.im/clean/2?_escaped_fragment_=%2Fcontato%2Frafa。
   这是不正确的：它应该是
   http://impulse.im/clean/2/#!/contato/rafa
4. 再次：http://impulse.im/clean/2/ - 单击“Contato”。现在重新加载页面。
5. 链接“Rafa”现在是正确的。

这个新函数（在 fadeOut 之后）对代码做了什么？为什么这个函数会破坏我的链接？

谢谢！

Answer 1

问题在于，您在数据中存储的 html 实际放置在页面上之前调用了地址插件。发生这种情况是因为您异步调用 $('#conteudo').html($('#conteudo', data).html()).fadeIn(500) 因为它是作为回调调用的淡出方法。

以这种方式更改：

var handler = function(data) {
    $('#conteudo').fadeOut(500, function() {
        $('#conteudo').html($('#conteudo', data).html()).fadeIn(500);
        $.address.title(/>([^<]*)<\/title/.exec(data)[1]);
    });
};

这将在新内容放置在页面中后调用您的地址插件。

之前是这样工作的。

处理程序返回数据->内容淡出->您调用了地址插件，但内容尚未放置在页面上 -> 500 毫秒后，添加内容的回调被调用。

现在就会变成这样了。

处理程序返回数据->内容淡出-> 500ms 后添加内容并调用地址插件