get ajax hash url on page load

2019-07-15 21:42发布

站内问答 / jQuery
1651 4 4

so say I set a hash when i do an ajax call:

example: http://example.com/#hash.html

if I load another page and click on the backbutton, how would i detect the hash and extract the url on load? The rest I got already covered :).

If you need more code, please tell me. btw, i'm using jquery.

4条回答
Root（大扎）
2楼-- · 2019-07-15 21:56

Simple example using window.location.hash to load appropriate hash content set in url while navigating back and forth.

Hope this helps someone...cheers!! 

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
    a{
        text-decoration: none;
        color:#999;
        font: arial;
    }
    .content{
        width: 50%;
        height: 30px;
        border:1px solid darkorange;
        padding: 3%;color:#999;
    }
</style>


<body>
<div class="box">
<a id="hash1" href="">Add Hash1</a>
<a id="hash2" href="">Add Hash2</a>
</div>
<div class="content"></div>
<script src="jquery-1.11.3.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
    $(".box a").click(function(e) {
        window.location.hash = $(this).attr("id");
        e.preventDefault();
    });
$(window).on('hashchange', function() {
  if (location.hash === '#hash1') {
    $("div.content").html('Hash one added!');
  }
  if (location.hash === '#hash2') {
    $("div.content").html('Hash two added!');
  }
  if (location.hash === '') {
    $("div.content").html('');
  }
});
});
</script>
</body>
</html>
查看更多
0人赞 添加讨论(0) 举报
傲
3楼-- · 2019-07-15 22:02 
$(function() {
   var page = window.location.hash;
   if (page == "") page = "somedefaultpage.html";
   $("#content").load(page);
});

If you've wired up your navigation properly the page loaded into your content element should already be there since the browser had to navigate to that #hash

查看更多
0人赞 添加讨论(0) 举报
Rolldiameter
4楼-- · 2019-07-15 22:09

There is an event, hashchange, but it's only supported in Firefox 3.6, IE8 and I assume the latest Chromes and Safaris.

For best support, detect the hashchange event, and if not present, use a polling function with setInterval().

So you would do something like...

(function() { 

   var hash = window.location.hash;

   if ('onhashchange' in window) {
      window.onhashchange = hashChanged;
   } else {
      setInterval(function() {
         if (window.location.hash != hash) {
             hash = window.location.hash;
             hashChanged();
         }
      }, 500);
   }

   var hashChanged = function() {
     alert('Hash has changed!');
   };

})();
查看更多
0人赞 添加讨论(0) 举报
走好不送
5楼-- · 2019-07-15 22:17

You have a couple of options.

The most obvious one is

window.location.hash;

...which has been part of actual JavaScript for some years (more information here or by googling "javascript location hash").

There is also a jQuery plugin called jQuery.Url which has a lot of nice features for working with URLs.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)