Javascript在将其放入历史记录之前更改url参数

beg*_*er_ 0 javascript browser-history http-request-parameters

我正在使用datatables JQuery插件.我使用它与AJAX和分页(服务器端).每行包含指向该记录详细视图的链接.单击该链接然后在后退按钮上,我想返回上一页.(注意:不能使用数据表自带状态保存).

这可以实现如果您可以在将url参数放入历史记录之前将其添加到当前URL.

可以这样做吗?纯JS或JQuery并不重要.

(注意:我很新做这种东西,已经读过关于使用#的内容,但从未这样做过,所以如果你建议请提供一个适用于我的问题的例子)

编辑:

非常基本的JQuery插件指南bbq(http://benalman.com/projects/jquery-bbq-plugin/)

假设URL的散列为#a = 2&b = test,您可以通过以下方式获取值:

//true = optional converts 2 to an integer, false to boolean,...
var a = $.bbq.getState('a',true);
Run Code Online (Sandbox Code Playgroud)

您可以通过以下方式更改/添加值:

var hash = "a=3&b=hello";
$.bbq.pushState(hash);
Run Code Online (Sandbox Code Playgroud)

pushState在绑定时触发hashchange事件.要绑定事件,但在doucment.ready函数中跟随:

// called when # part of URL is modified
$(window).bind( 'hashchange', function( event ) {
    var hash = event.fragment; // full hash as string
    var a = event.getState('a', true ); // value for a
    // here do meaningful action like an AJAX request using the hash parameters    
});
Run Code Online (Sandbox Code Playgroud)

Jul*_* D. 5

是的,HTML5 History API允许您这样做.查看MDN上的" 操作浏览器历史记录"文章.

下面是一个将参数添加到当前URL并替换当前历史记录条目的示例:

 var newURL = location.href + (location.search ? "&" : "?") + "myParameter=myValue";
 history.replaceState({}, '', newURL);
Run Code Online (Sandbox Code Playgroud)

History API是HTML5功能,遗憾的是并非所有浏览器都支持.但是,有一个名为history.js的polyfill 声称可以为所有浏览器提供支持.

更新:

您可能希望查看现有的解决方案和jQuery插件,而不是滚动自己的AJAX历史实现.看看例如什么是最好的后退按钮jQuery插件的答案题.