js事件冒泡导致url改变的问题

Question

今天遇到一个事件冒泡的问题，如果代码

这样写就没有问题
请求地址是http://localhost:8080/#/login
但是把阻止事件去掉，以这样的请求地址http://localhost:8080/#/login就会刷新一下页面
请求地址变成http://localhost:8080/?#/login才能继续请求。
有人知道原因么

Answer 1

<button type="button">btn</button>

我觉得你的重点应该方法 type 上面。 Internet Explorer 的默认类型是 "button"，而其他浏览器中（包括 W3C 规范）的默认值是 "submit"。

那么问题就解决了，是你点了 submit 提交了表单，所以使用呢？

1. 使用 type="button"
2. 使用 阻止默认事件 .prevent

Answer 2

<form></form>内button标签的type属性默认是submit，点击会提交表单

Answer 3

阻止事件冒泡
event.stopPropagation()
阻止事件默认行为（例如你的 submit 默认行为）
event.preventDefault()

Answer 4

当点击 button 的时候，不仅触发了 submitLogin 方法，还会继续向上冒泡触发 form 的默认行为。

Answer 5

直接用div，简单粗暴，不用纠结

Answer 6

这个问题已经解决了。几位答友都说到了点上，可能碍于篇幅的缘故各位没有展开讲。
https://blog.csdn.net/whd526/...
这个讲解比较详细，有同学遇到类似问题可以看看