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

2024-02-23 0 298

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点击按钮跳转页面内容请搜索悠久资源网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持悠久资源网!

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

悠久资源 HTML/Xhtml html页面点击按钮实现页面跳转功能 https://www.u-9.cn/sheji/html/172638.html

常见问题

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务