前言
问题描述
做H5实训大作业时遇到的问题,发现在按钮点击事件里使用window.location.href进行页面跳转时,始终无法进行页面跳转
正文
1.button标签点击跳转事件无效
以下是我的示例代码
<form action="">
......
<button id="loginBtn">登录</button>
......
</form>
<script>
$("#loginBtn").click(function(){
window.location.href="./index.html";
})
</script>
出错原因及解决方法
form表单中,使用·button标签时若没有设置type=“button”,则button点击时默认会触发form表单的提交事件,所以window.location.href="xxxx"就无法跳转,因此解决方法就是在button标签上添加 type="button"即可
2.a标签点击事件无效
后来还了解到使用<a></a>标签做点击事件时,window.location.href="xxx"无效
出错原因及解决方法
点击<a></a>标签时触发了href属性的加载,所以又跳转回原来的页面了,故而window.location.href失效;因此将a标签的href属性设置成javascript:void(0)即可,即<a href=“javascript:void(0)”></a>
后记
做个梦给你