更改页面网址而不刷新页面

时间:2009-12-14 00:18:12

标签: php jquery ajax

这甚至可能吗?

问题在于:

我使用此网址进行了关键字搜索(搜索后):http://localhost/thi/search?keyword=key

然后我有一个滑块搜索,它使用AjaxForm插件(jquery)...

当我执行滑块搜索时,显然我仍然会在关键字搜索网址中(因为请求是通过ajax发送的)

有没有办法将当前网址更改为http://localhost/thi/search?price=100(滑块通过GET提交,价格为GET变量)

我希望这样做是因为我希望将滑块中的搜索结果添加为书签...或者是否有其他方法可以执行此操作?

3 个答案:

答案 0 :(得分:6)

您可以使用哈希网址(搜索#price = 100)和window.location.hash方法。这些将被加入书签,用户可以使用后退和前进按钮浏览这些内容。

使用示例:

<a href="#">100</a>

$('a').click(function() {
    window.location.hash = 'price='+$(this).html();
    return false;
});

将网址设置为search#price=100而不刷新。

答案 1 :(得分:3)

我能为此建议的最好的方法是在url中使用hash。这将允许用户为网址添加书签,并在他们回来时仍保持状态。另一个好处是您可以在不刷新页面的情况下更改哈希值。

所以你的网址看起来像...... http://localhost/thi/search?keyword=key#price=100

JQuery Address插件可以很好地用于此。

http://www.asual.com/jquery/address/

答案 2 :(得分:2)

使用HTML5是可能的。使用window.history.pushState()。

示例:

if(currentHref!=window.location){
    window.history.pushState({path:currentHref},'',currentHref);    
}

详情和说明:http://tinywall.info/2012/02/22/change-browser-url-without-page-reload-refresh-with-ajax-request-using-javascript-html5-history-api-php-jquery-like-facebook-github-navigation-menu/