html页面点击按钮实现页面跳转功能
发布时间：2023-07-13 16:44:18 作者：Hi~晴天大圣 
我要评论
我要评论这篇文章主要介绍了html页面点击按钮实现页面跳转功能,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
html页面点击按钮实现页面跳转
方法1、在button标签外嵌套一个a标签，利用超链接进行跳转；
<a href="https://www.baidu.com/" target="_blank"> <button>进入baidu首页</button> </a>
方法2、在button标签中添加οnclick="window.location.href=‘页面url’"代码，使用onclick事件进行跳转。
<button onclick="window.location.href = 'https://www.baidu.com/' target="_blank"">进入baidu首页</button>
html页面自动跳转方法
1.使用meta元素
<meta http-equiv="refresh" content="5;url=hello.html">
http-equiv=“refresh” 是刷新页面，5秒后执行刷新操作，url是跳转的目的页面地址。
<meta http-equiv="refresh" content="5">
这行代码的意思是只刷新，不跳转。
2.使用script代码
立即跳转到hello.html页面。
<script type="text/javascript"> window.location.href = 'hello.html'; </script>
或者
<script language="javascript">
location.replace("http://www.baidu.com/");
</script>5秒后跳转到hello.html页面。
<script type="text/javascript">
setTimeout("window.location.href = 'hello.html'", 5000);
</script>3.判断是否手机端
<script type="text/javascript">
var wapurl = window.location.pathname;
if
(/Android|webOS|iPhone|iPod|BlackBerry|Windows CE|Windows Phone/i.test(navigator.userAgent))
{if
(window.location.href.toLowerCase().indexOf("?pc")<0)
{try
{window.location.href="/wap"+wapurl}
catch(e){}}
}
</script>到此这篇关于html页面点击按钮实现页面跳转的文章就介绍到这了,更多相关html点击按钮跳转页面内容请搜索脚本之家以前的文章或继续浏览下面的相关文章，希望大家以后多多支持脚本之家！
相关文章
- 这篇文章主要介绍了HTML点击按钮button跳转页面的四种方法,每种方法结合实例代码给大家介绍的非常详细，需要的朋友可以参考下2023-06-27
最新评论