我如何让一个JavaScript动作对当前页面有一些影响,但也会改变浏览器中的URL,这样当用户点击重新加载或书签时,就会使用新的URL ?

如果后退按钮可以重新加载原始URL,那就太好了。

我试图在URL中记录JavaScript状态。


当前回答

浏览器安全设置阻止人们直接修改显示的url。你可以想象这会导致什么样的网络钓鱼漏洞。

在不更改页面的情况下更改url的唯一可靠方法是使用内部链接或散列。例如:http://site.com/page.html变成http://site.com/page.html#item1。这种技术经常用于hijax(AJAX +保存历史)。

当这样做的时候,我经常只使用哈希作为href的操作链接,然后用jquery添加点击事件,使用所请求的哈希来确定和委托操作。

我希望这能让你走上正确的道路。

其他回答

我强烈怀疑这是不可能的,因为如果是的话,这将是一个令人难以置信的安全问题。例如,我可以制作一个看起来像银行登录页面的页面,并使地址栏中的URL看起来像真正的银行!

也许如果你解释一下为什么你想这样做,人们可能会建议其他的方法……

[2011年编辑:自从我在2008年写了这个答案以来,更多关于HTML5技术的信息浮出了出来,该技术允许修改URL,只要它来自同一个来源]

什么是为我工作是- history.replaceState()函数这是如下-

history.replaceState(data,"Title of page"[,'url-of-the-page']);

这将不会重新加载页面,你可以使用javascript的事件

有一个Yahoo YUI组件(浏览器历史记录管理器)可以处理这个问题:http://developer.yahoo.com/yui/history/

我的代码是:

//change address bar
function setLocation(curLoc){
    try {
        history.pushState(null, null, curLoc);
        return false;
    } catch(e) {}
        location.hash = '#' + curLoc;
}

和行动:

setLocation('http://example.com/your-url-here');

和示例

$(document).ready(function(){
    $('nav li a').on('click', function(){
        if($(this).hasClass('active')) {

        } else {
            setLocation($(this).attr('href'));
        }
            return false;
    });
});

这就是全部:)

在HTML 5中,使用历史记录。pushState函数。举个例子:

<script type="text/javascript">
var stateObj = { foo: "bar" };
function change_my_url()
{
   history.pushState(stateObj, "page 2", "bar.html");
}
var link = document.getElementById('click');
link.addEventListener('click', change_my_url, false);
</script>

和href:

<a href="#" id='click'>Click to change url to bar.html</a>

如果您希望在不向后退按钮列表添加条目的情况下更改URL,请使用历史记录。replaceState代替。