1

为了快速解释，我页面上的所有链接目前都使用以下格式：

<a href="javascript:;" onclick="loadPageWithAjax();">Link</a>

我想做的是将代码升级到以下内容：

<a href="actual/path/to/content" onclick="loadPageWithAjax();">Link</a>

我的目标有两个：

  1. 使状态栏显示链接指向的 URL
  2. 允许用户复制链接位置并使其成为有效 URL

我的问题是这会忽略 onclick 并实际重定向到 URL。解决此问题的最佳方法是什么？

4

3 回答 3

1

如果您使用的是 jQuery，那么我建议您使用History.js或jQuery BBQ。它们都为 HTML5 pushState 提供了良好的支持，并为 HTML4 浏览器提供了备用。使用 pushState，您将能够更新 URL（使其可收藏），并且您可以使用 statechange 事件来处理导航（例如当用户点击后退按钮时）。查看 History.js 的文档以了解其工作原理的一些示例。

更新：

根据您的评论，我建议为您希望通过 AJAX 请求处理的链接创建一个事件处理程序。

例如，假设您想成为 ajaxy 的所有链接都具有“ajaxify”类。

$(document).on("click", "a.ajaxify", function(e) {
    var url = $(this).attr("href");
    History.pushState({}, null, url);

    // do something, like make an ajax request to get the url

    e.preventDefault();
});
于 2012-04-30T05:55:15.890 回答
0

在您的loadPageWithAjax()函数中，您需要能够获取浏览器自动调用的事件数据。

function loadPageWithAjax(e){
    e.preventDefault(); stops page from clicking
    //do your ajax stuff
}
于 2012-04-30T05:17:11.957 回答
0

history.pushState除非您使用 window.location.hash 或 new （仅适用于 HTML5 浏览器）使用哈希，否则您无法在不更改加载页面的情况下设置地址栏的 URL 。

于 2012-04-30T05:49:50.873 回答