Change complete URL in adress bar, without reloading the page

Question

What I need is for a webpage to completely alter the users adressbar on visit.

For instance: I visit www.X.com, but my adress bar displays www.Z.com.

I have already looked at history.pushState / history.replaceState, but using them I get results like this: www.X.com/www.Z.com.

Is there a way, preferably using history.pushState/replaceState, to accomplish this effect?

Answer 1

function changeUrl(page, url) {
    if (typeof (history.pushState) != "undefined") {
        var obj = { Page: page, Url: url };
        history.pushState(obj, obj.Page, obj.Url);
    } else {
        alert("Browser does not support HTML5.");
    }
}
$(function () {
    $("#button1").click(function () {
        changeUrl('Page1', 'Page1.htm');
    });
    $("#button2").click(function () {
        changeUrl('Page2', 'Page2.htm');
    });
    $("#button3").click(function () {
        changeUrl('Page3', 'Page3.htm');
    });
});

Answer 2

我与托管服务提供商解决了该问题。