点击button自动刷新页面的奇葩错误

以前在写练习的时候遇到过这样一个问题，自己在html中写了一个button

<button>test1</button>

在没有给其附上onclick事件时是点击是不会有任何反应的
但是把这个button放入from表单时

<form action="testAction" method="psot">

    <button>test1</button>

</form>

无论有没有给button附上事件，点击后页面都会刷新
查找了半天资料网上有说是不是事件写错了或者是js冲突啊之类的问题，在确认了自己的所有方法没有写错之后，按照那些教程改了之后依旧没有解决，那么出现这种错误就不是冲突的问题

后来将button的代码加了一个type属性之后，问题就解决了

<button type="button">test1</button>

到这个时候才发现自己犯了一个很弱智的问题，<button> 标签有一个默认的属性是type="submit" 等于说如果你不自己手动覆盖的话，每一个默认写的button都是起到submit的作用，自然页面就会刷新。当加上type="button" 后，button就变为了一个普通的按钮，需要加上onclick事件才会有相应的反应了。
虽然只是一个微不足道的小bug，但对html不熟的我来说确实是修改了很长一段时间，所以特此记录下来，以防以后遇到相同的坑

巴特西

点击button自动刷新页面的奇葩错误

最新文章

热门文章