This question already has answers here:
How do I modify the URL without reloading the page?
                            
                                (16个答案)
                            
                    
                6年前关闭。
        

    

是否可以在网址栏中更改参数,以便单击按钮以更改参数?到目前为止,我有这个:

function change_product(){
var url =  'http://www.example.com/index.php?product=805';
var newSrc = '0';
newurl=url.replace(/(product=)[^\&]+/,'$1' + newSrc)
alert(newurl);
}

<button class="save" type="BUTTON" onclick="change_product();">Copy</button>


newurl是正确的,但是如何在url栏中进行更改?没有页面重新加载就可以吗?
提前致谢 !

最佳答案

看看window.history.pushState()

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

这样,您无需重新加载页面即可更改地址栏中的URL。

这是当前的支持:http://caniuse.com/#search=pushstate

var state = {}, newUrl = "test.html";
window.history.pushState(state, "Page Title", newUrl);


所以对你来说

function change_product(){
    var productId = 805;
    window.history.pushState({productId: productId} , "", "?product=" + productId);
}


Firefox当前确实使用页面标题,但是您可以在状态对象中进行设置,然后使用window.onpopstate获取状态对象并设置页面标题(如果需要)。

如果您需要支持较旧的IE浏览器,则有一些库可以为您提供帮助(例如history.js)

10-05 20:28
查看更多