zoukankan      html  css  js  c++  java
  • window.location.hash(hash应用)---跳转到hash值制定的具体页面

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash="#admin"。利用这个属性值可以做一个非常有意义的事情。

    很多人都喜欢收藏网页,以便于以后的浏览。不过对于Ajax页面来说的话,一般用一个页面来处理所有的事务,也就是说,如果你浏览到一个Ajax页面里边有意思的内容,想将它收藏起来,可是地址只有一个呀,下次你打开这个地址,还是得像以往一样不断地去点击网页,找到你钟情的那个页面。另外的话,浏览器上的“前进”“后退”按钮也会失效,这于很多习惯了传统页面的用户来说,是一个很大的使用障碍。

    那么,怎么用location.hash来解决这两个问题呢?其实一点也不神秘。

    比如,我的作者管理系统,主要功能有三个:普通搜索、高级搜索、后台管理,我分别给它们分配一个hash值:#search、#advsearch、#admin,在页面初始化的时候,通过window.location.hash来判断用户需要访问的页面,然后通过javascript来调整显示页面。比如:

    var hash; 
    hash=(!window.location.hash)?"#search":window.location.hash; 
    window.location.hash=hash; 
      //调整地址栏地址,使前进、后退按钮能使用 
    switch(hash){   
    case "#search":  
        selectPanel("pnlSearch");   //显示普通搜索面板  
        break;    
    case "#advsearch":    
          
    case "#admin":  
         
    }
     
    参考网址

    ================================备注================================================

    hashchange是老API, 浏览器支持度高, 本来是用来监听hash变化的, 可以被利用来做客户端前进后退, 但应该不是这个API的存在的主要目的.
    而popstate, 及相关api, pushState等属于HTML5新标准, 产生的目的就是做客户端前进后退的, 不仅可以支持hash, 非hash的同源url也支持.
    所以一般用法是浏览器支持就用popstate, 不支持再降级使用hashchange, 
     
  • 相关阅读:
    lintcode42- Maximum Subarray II- medium
    leetcode53- Maximum Subarray- easy
    leetcode50- Pow(x, n)- medium
    leetcode23- Merge k Sorted Lists- hard
    leetcode21- Merge Two Sorted Lists- easy
    lintcode121- Word Ladder II- hard
    lintcode107- Word Break- medium
    lintcode10- Permutation Index II- medium
    AM335x关于LCD屏幕的时钟PLL配置 分类: TI-AM335X 2015-06-16 18:32 341人阅读 评论(0) 收藏
    用DriverStudio开发USB驱动程序 分类: USB OTG驱动 2015-06-12 10:34 376人阅读 评论(0) 收藏
  • 原文地址:https://www.cnblogs.com/yongwang/p/7568170.html
Copyright © 2011-2022 走看看