Home > Web Front-end > JS Tutorial > window.location.hash attribute usage instructions_javascript skills

window.location.hash attribute usage instructions_javascript skills

WBOY
Release: 2016-05-16 18:31:58
Original
1092 people have browsed it

For example, location.hash="#admin" of http://domain/#admin. A very meaningful thing can be done using this attribute value.
Many people like to bookmark web pages for easy browsing in the future. But for Ajax pages, one page is generally used to handle all transactions. That is to say, if you browse to interesting content in an Ajax page and want to save it, but there is only one address, you can open it next time. For this address, you still have to click on the web page as usual to find the page you love. In addition, the "forward" and "back" buttons on the browser will also become invalid, which is a big obstacle to use for many users who are accustomed to traditional pages.
So, how to use location.hash to solve these two problems? It's not mysterious at all.
For example, my author management system has three main functions: normal search, advanced search, and background management. I assign a hash value to them respectively: #search, #advsearch, #admin. When the page is initialized, through window.location.hash to determine the page the user needs to access, and then adjust the displayed page through javascript. For example:

Copy code The code is as follows:

var hash;
hash=(! window.location.hash)?"#search":window.location.hash;
window.location.hash=hash;
//Adjust the address bar address so that the forward and back buttons can use
switch (hash){
case "#search":
selectPanel("pnlSearch"); //Display the normal search panel
break;
case "#advsearch":
case "#admin ":
}

Use the statement window.location.hash=hash to adjust the address of the address bar so that the "forward" and "back" buttons in the browser can be used normally (essentially deceives the browser). Then different panels are displayed based on different hash values ​​(the user can collect the corresponding panels), which makes the browsing of Ajax pages more traditional.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template