Home > Web Front-end > JS Tutorial > body text

Usage of window.history in js (2)

零下一度
Release: 2017-05-18 10:47:29
Original
2083 people have browsed it

Window.history saves the user's website access record during a session. A new history record is created every time the user accesses a new URL.

history.go(), history.back(), history.forward()history.back() and history.forward() represent one page backward and one page forward respectively. history.go(num) indicates how many pages to turn forward or backward. If num is a positive number, it means turning forward, and if it is a negative number, it means turning backward.

Windows window object (history) history.go(), history.back(), history.forward().

Because windows object reference is not necessary. So windows.history.go() == history.go().

The go() method has only one parameter, which can be an integer or a negative number. If it's positive, move forward. Negative numbers mean going backwards. (Equivalent to the difference between Forward and Back)

Therefore, to go back one page, you can use the following code: (To go back multiple pages, just change the parameters of go)

   window.history.go(-1);
Copy after login

To go forward one page, You only need to use positive numbers;

   history.go(1);
Copy after login

In addition, you can use the back() and forward() methods to achieve the same operation:

      history.back();   后退
      history.forward(); 前进
Copy after login

You can also use the length attribute to view the number of pages in the history:

   history.length;
Copy after login

2. The difference between history.go(-1) and history.back()

history.go(-1)表示后退与刷新。如数据有改变也随之改变
   history.back()只是单纯的返回到上一页。
Copy after login

Example:

Html code

<p class="oper_context_view">  
          <a id="btn_exit" class="btn" href="javascript:void(0);">返回</a>  
 </p>
Copy after login

Js code

$("#btn_exit").bind("click",function(){  
              window.location.reload();    //刷新  
              window.history.go(1);         //前进  
              window.history.go(-1);        //返回+刷新  
              window.history.forward();  //前进  
              window.history.back();       //返回  
  });
Copy after login

【Related Recommendations】

1. Special Recommendation:"php Programmer Toolbox" V0.1 version Download

2. Usage of window.history in js (1)

3. Detailed introduction to history.pushState() in h5 Usage examples

4. In-depth understanding of the history features in h5-pushState, replaceState

5. The impact of the History API in h5 on web applications

The above is the detailed content of Usage of window.history in js (2). For more information, please follow other related articles on the PHP Chinese website!

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