• 设为首页
  • 收藏本站
  • 积分充值
  • VIP赞助
  • 手机版
  • 微博
  • 微信
    微信公众号 添加方式:
    1:搜索微信号(888888
    2:扫描左侧二维码
  • 快捷导航
    福建二哥 门户 查看主题

    html页面点击按钮实现页面跳转功能

    发布者: 嘉神 | 发布时间: 2025-8-17 00:16| 查看数: 43| 评论数: 0|帖子模式

    html页面点击按钮实现页面跳转

    方法1、在button标签外嵌套一个a标签,利用超链接进行跳转;
    1. <a href="https://www.baidu.com/" target="_blank">
    2.  <button>进入baidu首页</button>
    3. </a>
    复制代码
    方法2、在button标签中添加οnclick="window.location.href=‘页面url’"代码,使用onclick事件进行跳转。
    1. <button onclick="window.location.href = 'https://www.baidu.com/' target="_blank"">进入baidu首页</button>
    复制代码
    html页面自动跳转方法

    1.使用meta元素
    1. <meta http-equiv="refresh" content="5;url=hello.html">
    复制代码
    http-equiv=“refresh” 是刷新页面,5秒后执行刷新操作,url是跳转的目的页面地址。
    1. <meta http-equiv="refresh" content="5">
    复制代码
    这行代码的意思是只刷新,不跳转。
    2.使用script代码

    立即跳转到hello.html页面。
    1. <script type="text/javascript">
    2.     window.location.href = 'hello.html';
    3. </script>
    复制代码
    或者
    1. <script language="javascript">
    2.     location.replace("http://www.baidu.com/");
    3. </script>
    复制代码
    5秒后跳转到hello.html页面。
    1. <script type="text/javascript">
    2.     setTimeout("window.location.href = 'hello.html'", 5000);
    3. </script>
    复制代码
    3.判断是否手机端
    1. <script type="text/javascript">
    2. var wapurl = window.location.pathname; 
    3. if
    4.     (/Android|webOS|iPhone|iPod|BlackBerry|Windows CE|Windows Phone/i.test(navigator.userAgent))
    5. {if
    6.     (window.location.href.toLowerCase().indexOf("?pc")<0)
    7. {try
    8.     {window.location.href="/wap"+wapurl}
    9.     catch(e){}}
    10.     }
    11. </script>
    复制代码
    到此这篇关于html页面点击按钮实现页面跳转的文章就介绍到这了,更多相关html点击按钮跳转页面内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!

    来源:互联网
    免责声明:如果侵犯了您的权益,请联系站长(1277306191@qq.com),我们会及时删除侵权内容,谢谢合作!

    最新评论

    QQ Archiver 手机版 小黑屋 福建二哥 ( 闽ICP备2022004717号|闽公网安备35052402000345号 )

    Powered by Discuz! X3.5 © 2001-2023

    快速回复 返回顶部 返回列表