Home  >  Article  >  Web Front-end  >  How to realize automatic jump in html page

How to realize automatic jump in html page

coldplay.xixi
coldplay.xixiOriginal
2021-04-26 14:41:2920518browse

Methods for automatic redirection of html pages: 1. Use the meta tag, which is responsible for providing meta-information of the document; 2. Use the header function to redirect the URL; 3. Use JavaScript to make a very powerful function program script.

How to realize automatic jump in html page

The operating environment of this tutorial: windows7 system, html5 version, DELL G3 computer.

How to realize automatic jump of html page:

Method 1: Use meta tag

meta tag is not html One of the missing tags, it is responsible for providing meta-information of the document. Its parameters mainly include:

① http-equiv: HTTP file header related to the data in the document

② content: and Name the data related to the HTTP header

③ name: Document description

④ url: URL associated with meta information

When we define the attribute http-equiv as refresh, open For this Web page, the system will jump to the corresponding page within a certain period of time based on the value specified by content. Content="seconds;url=website" defines how long it takes to jump to the specified URL. The following meta tag tells the system that the page will automatically jump to Dark Horse Online Power after one second.

The above code needs to be added to the header of the HTTP document, between 93f0f5c25f18dab9d176bd4f6de5d30e and 9c3bca370b5104690d9ef395f2c5f8d1. Usually, the meta tag follows 93f0f5c25f18dab9d176bd4f6de5d30e. If multiple meta tags are required, they can each occupy their own line.

This method is applicable to any environment, including static website spaces.

Method 2: Use the header function

The header function is one of the HTTP-related functions in PHP's built-in functions. This function sends the HTTP protocol header to the browser. Use it to redirect the URL, that is, the page will redirect to other specified web pages. The following example will automatically open the homepage of Dark Horse Online Power after execution.

It must be noted that the header function can only be used before the 100db36a723c770d327fc0aef2ce13b1 tag in the page code, that is, before any other headers (93f0f5c25f18dab9d176bd4f6de5d30e) in the HTTP header have been sent to the browser, and , the previous page could not print or echo any content. In other words, the program simply handles the header event before the 100db36a723c770d327fc0aef2ce13b1 of the page appears. Despite such strict requirements, if you use it flexibly, you can still achieve the automatic jump function of the page, such as the login page, and decide where to jump to the page by judging whether the data submitted by the user is legal. A simple example is given below:

<?php
/* 登录程序 - 文件名:login.php
 程序作用 - 判断用户登录口令 */
if($_POST['Submit']) {
   session_start();
   if($_POST['pws']=='123') { //若密码为 123
      $_SESSION['passwd']='123'; //写入会话数据
      header("Location:index.php"); //跳转到正常页面
   }else{
      header("Location:login.php"); //跳转到登录页面
   }
}
//表单代码略(也可以用纯html代码写表单,若如此,代码应放在程序之后
?>
<?php
/* 检测会话数据 - 文件名:index.php
 程序作用     - 检测会话数据中的密码是否为123,若不是,返回
         登录页面         */
session_start();
if($_SESSION['passwd']!='123') header("Location:login.php");
//其他代码(纯HTML代码应写在程序之后)
?>

This method can obviously only be used in space environments that support PHP.

Method 3: Using JavaScript

JS is very flexible and can be used to make very powerful program scripts. Here is just a simple page that automatically jumps. JS example. After the following code is executed, the browser will automatically go to the Black Horse Online Power website. This code can be placed in any legal position on the page:

<script language="javascript" type="text/javascript">
    window.location.href("http://www.gxblk.com");
</script>

This code is suitable for any Web environment. If you add a timer, it will be even more wonderful.

Related learning recommendations: html video tutorial

The above is the detailed content of How to realize automatic jump in html page. For more information, please follow other related articles on the PHP Chinese website!

Statement:
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