How to realize page jump by clicking button in HTML

Method: 1. Use the onclick event and add "onclick="window.location.href=address"" in the tag; 2. Wrap an a tag in the button tag and use href in the a tag. Add jump code to the attribute.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

Method 1: Use the onclick event

<input type="button" value="按钮"
onclick="javascrtpt:window.location.href=&#39;http://www.baidu.com/&#39;" />

or directly use the button tag

<button onclick="window.location.href = &#39;https://www.baidu.com/&#39;">百度</button>

Method 2: Coat the button tag with an a tag

<a href="http://www.baidu.com/">
    <button>百度</button>
</a>

or use

<a href="http://www.baidu.com/">
      <input type="button" value="百度" />
</a>

Method 3: Using JavaScript functions

<script>
      function jump() {
        window.location.href = "http://www.baidu.com/";
      }
    </script>
    <input type="button" value="百度" onclick="javascrtpt:jump()" />
    <!-- 或者<input type="button" value="百度" onclick="jump()" />  -->
    <!-- 或者<button onclick="jump()">百度</button> -->

Recommended learning: html video tutorial

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