Using JavaScript to change the URL used when a pag

JavaScript doesn't allow you to update window.location without triggering a reload. While I agree with this policy in principle (it shouldn't be possible to visit my website and have JavaScript change the location bar to read www.yourbankingsite.com,) I believe that it should be possible to change www.foo.org/index to www.foo.org/help.

The only reason I care about this is for bookmarking. I'm working on a photo browser, and when a user is previewing a particular image, I want that image to be the default if they should bookmark that page. For example, if they are viewing foo.org/preview/images0-30 and they click on image #15, that image is expanded to a medium-sized view. If they then bookmark the page, I want the bookmark URL to be foo.org/preview/images0-30/active15.

Any thoughts, or is there a security barrier on this one as well? I can certainly understand the same policy being applied here, but one can dream.

标签： javascript url bookmarks

6条回答

▲ chillily

2楼-- · 2019-02-19 16:46

Sounds like you should check out Really Simple History. It's how Google (for example, Gmail) allows any page to be bookmarkable (and has history) but doesn't refresh the whole page.

As for the other side of things (having people visit your site then automatically popping up the correct image), I'd try checking window.location.hash once the page loads and firing events based on that.

0人赞添加讨论(0) 举报

一纸荒年 Trace。

3楼-- · 2019-02-19 16:47

You can add [Add to Favorites] button on the page.

Sample:

var urlAddress = "http://www.example.com/#image1";
var pageName = "Example Page Title - Image1";
function addToFavorites() {
    if (window.external) {
        window.external.AddFavorite(urlAddress, pageName); 
    } else {
        alert("Sorry! Your browser doesn't support this function."); 
    }
}

Or use one of these jQuery plugins:

AND / OR

Use URLs with hash at the end and load your content (images etc.) based on that hash value.

function onLoad() {
    if (window.location.hash == "image1") {
        // load image1
    }
}

There are also lots for jQuery plugins for working with URL hash events, for example:

There are also lots of non jQuery JavaScript libraries for that, for example:

http://code.google.com/p/reallysimplehistory/

0人赞添加讨论(0) 举报

Animai°情兽

4楼-- · 2019-02-19 16:56

As mentioned, generally with ajaxy sites, you manipulate/check the hash part of the URL (window.location.hash) to determine this kind of activity.

The biggest issue is making sure to check against the hash in DOM-ready/window-load, as if the user clicked on a given image. This will work with browsers and bookmarks, but may hamper search indexing.

0人赞添加讨论(0) 举报

我欲成王，谁敢阻挡

5楼-- · 2019-02-19 16:58

You can add an anchor to the URL without reloading the page and pick that up with javascript:

location.href = '.../#' + imageId;

0人赞添加讨论(0) 举报

走好不送

6楼-- · 2019-02-19 17:01

<html>

<head>
<script type="text/javascript">
function myHref(){
    document.getElementById('myAnchor').innerHTML="Visit Google"
    document.getElementById('myAnchor').href="http://www.google.com"
}
</script>
</head>

<body>
    <a id="myAnchor" href="http://www.java2s.com">Visit Java2s</a>
    <form>
        <input type="button" onclick="myHref()" value="Change URL and text">
    </form>
</body>

</html>

0人赞添加讨论(0) 举报

仙女界的扛把子

7楼-- · 2019-02-19 17:03

How about detecting on page load if the URL contains a hash, and if it does, directing them to the page you want them to go to?

0人赞添加讨论(0) 举报