jQuery 地址插件帮助

Question

我在弄清楚如何使用 jQuery 地址插件时遇到了一些困难 - http://www. asual.com/jquery/address/- 以我有限的 jQuery/javascript 知识，我会认真挖掘一些帮助！

到目前为止，我的代码如下所示：

jQuery(function($) {
   $.ajaxSetup({ cache: false });
   var hijax = $('ul.hijax a');
   var loader = $('<div id="spinner"></div>');
   var container = $('#ajax-container');
   hijax.address(function() {
     dis = $(this);
     hijax.removeClass('ajax-on');
     dis.addClass('ajax-on');
     var url = dis.attr('href') + ' #biog-container';
     container.html(loader).load(url);
     return dis.attr('id');
   });
});

我希望这是不言自明的。我有一个指向页面的 ul 链接，我在其中通过 AJAX 加载 div 的内容，id 为 biog-container< /代码>。 AJAX 工作正常，并且 url 会使用链接的 id 进行更新，但是当我单击后退按钮时，url 会发生变化，但内容保持不变。

有什么想法吗，我是不是很傻？！

Answer 1

老实说，address 方法并不会为您做太多工作。实际上，该插件不会自动添加支持。

然而，做起来非常简单。您只需为 change 方法设置处理程序：

$.address.change(function(e){
    // The function receives a single eventobject parameter that contains the 
    // following properties: 
    //    value, path, pathNames, parameterNames, 
    //    parameters, queryString

    /* Do something based on e */
});

当地址更改时，您的函数就会被触发。您还可以将其他事件 internalChange 和 externalChange 设置为在内部或外部发生地址更改时触发。

---

编辑：只是为了扩展上面的内容：

这是一个完整的工作示例。换句话说，您不需要在插件中调用任何其他内容即可使其工作：

// Override the click events of links
$("a").click(function(e) {
    e.preventDefault();
    $.address.path(this.id);
});

// Method called with the address changes
$.address.change(function(e) {
    // This is called when the 
    $("#content").html("Something based on " + e.value);
});

• jsFiddle: http:// /jsfiddle.net/jonathon/2sFYu/
• 完整浏览器示例：http://jsfiddle.net/ jonathon/2sFYu/show（查看后退/前进）
• 直接进入深层链接：http://jsfiddle.net/jonathon/2sFYu/show/#/link4

单击链接时，它将地址路径（就插件而言）设置为链接的 ID。这会生成一个动作，以便后退/前进正常工作。它不会更改链接本身，因此如果未启用 JavaScript，它将转到链接地址。

$.address.change 位设置处理程序。这是您加载内容的位置。在我的示例中，它使用 e.value 来获取地址路径的值。因此，这将类似于 /link1、/link2 等。当链接在内部（由插件）或外部（由浏览器返回）更改时，会调用此处理程序/向前）。

注意：我注意到这在 jQuery 1.5.1 中不能完美地工作。我很确定这与 jQuery 1.5 属性选择器（地址插件似乎使用的）的更改有关。不过 jQuery 1.4 工作得很好。