Button按钮为什么无缘无故会提交form表单？

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/jal517486222/article/details/81459395

我的form表单里有好几个Button按钮，每个按钮有不同的功能，可是这些按钮居然都有提交功能，真是把我惊呆了

<button class="btn btn-info " onclick="do_collection()" 
title="非Guest用户可收藏">收藏</button>

这个问题困惑了我好几天一直百思不得其解，然后我就去查了一下button按钮的属性，才发现原来是因为我没有指定Button按钮的type属性值，type有三个可选属性：Button，submit，reset，而Button按钮的type属性默认值是submit ，所以在没有指定type属性的情况下，点击Button按钮触发提交form表单就合情合理了，所以要想此按钮不提交，可以指定Button按钮的type属性值为Button

<button class="btn btn-info " type="button" 
onclick="do_collection()" 
title="非Guest用户可收藏">收藏</button>