本文通过三种方法给大家介绍了HTML中button标签点击实现页面跳转,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧

方法1:使用onclick事件

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

或者直接使用button标签

<button onclick="window.location.href = 'https://www.baidu.com/'">百度</button> 

方法2:在button标签外套一个a标签

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

或使用

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

方法3:使用JavaScript函数

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

总结

以上所述是小编给大家介绍的HTML中button标签点击实现页面跳转的三种方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对爱安网网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

最新资讯
商务部:国家电子商务示范基地新增15家

商务部:国家电子商务示

日前,在北京召开的2020中国电子商务大会上,商务部公布了
数字浪潮倒逼成长 金融机构拥抱科技愈显积极

数字浪潮倒逼成长 金

一场金融科技领域的全球峰会9月24日在上海外滩揭开序
世界互联网教父:金融科技或成穷富人之间的“破壁机”

世界互联网教父:金融科

金融科技的“超能力”还远未用足,未来或许可以成为穷人
NASA推迟蓝色起源亚轨道宇宙飞船原定发射计划

NASA推迟蓝色起源亚轨

美国国家航空航天局(NASA)推迟Blue Origin原定发射计划
新专利显示苹果准备在iPhone和iPad上使用纳米纹理玻璃

新专利显示苹果准备在

苹果公司正在研究扩展其在Pro显示器XDR上引入的纳米纹
京东方拟121亿收购中电熊猫两产线

京东方拟121亿收购中

9月23日晚,京东方公告称,拟以超121亿元收购中电熊猫液晶
最新文章
浅析html webpack plugin插件的使用教程

浅析html webpack plu

这篇文章主要介绍了html webpack plugin插件的使用教
HTML转PDF的纯客户端和纯服务端实现方案

HTML转PDF的纯客户端

这篇文章主要介绍了HTML转PDF的纯客户端和纯服务端实
HTML行内元素与块级元素有哪些及区别详解

HTML行内元素与块级元

这篇文章主要介绍了HTML行内元素与块级元素有哪些及区
html+css 实现图片右上角加删除叉、图片删除按钮

html+css 实现图片右

这篇文章主要介绍了html+css 实现图片右上角加删除叉
详解iframe的src指向的内容不刷新的解决办法

详解iframe的src指向

这篇文章主要介绍了详解iframe的src指向的内容不刷新
浅析HTML 悬浮float的用法

浅析HTML 悬浮float的

float的用途比较广, 本文主要给大家介绍HTML 悬浮floa