表单按钮,无类型提交,提交表单
Form button, without type submit, submits form
我知道按钮上的 type="submit" 与输入相同。
这里的问题是:如果我有一个表单,没有任何提交 button/input,为什么会触发提交?
<form method="post" action="lf-p1-02a.html">
<div class="d-flex justify-content-center flex-wrap buttonCheck multiButtonCheck">
<button class="col-md-6 formButton bigButton">
<span>Button 1</span>
</button>
<button class="col-md-6 formButton bigButton">
<span>Button 2</span>
</button>
<button class="col-md-6 formButton bigButton">
<span>Button 3</span>
</button>
<button class="col-md-6 formButton bigButton">
<span>Button 4</span>
</button>
</div>
<div class="d-flex justify-content-center formFooter">
<button class="mainBtn">Continue</button>
</div>
</form>
Fiddle: http://jsfiddle.net/36zsa1t8/(我知道没有任何样式)。
表单中的“继续”按钮实际上是在提交表单,转到下一页。
代码上没有JavaScript。
知道为什么会这样吗?
如 中所述,对于大多数浏览器,button
的默认 type
是 submit
。
将 <Button>
标记更改为 <input type="button" value="Button">
<input type="button" class="col-md-6 formButton bigButton" value="Button">
<span>Utilizo el listado mensual de<br> consumo o límite preconcedido</span>
</input>
已更新JSFiddle
我知道按钮上的 type="submit" 与输入相同。
这里的问题是:如果我有一个表单,没有任何提交 button/input,为什么会触发提交?
<form method="post" action="lf-p1-02a.html">
<div class="d-flex justify-content-center flex-wrap buttonCheck multiButtonCheck">
<button class="col-md-6 formButton bigButton">
<span>Button 1</span>
</button>
<button class="col-md-6 formButton bigButton">
<span>Button 2</span>
</button>
<button class="col-md-6 formButton bigButton">
<span>Button 3</span>
</button>
<button class="col-md-6 formButton bigButton">
<span>Button 4</span>
</button>
</div>
<div class="d-flex justify-content-center formFooter">
<button class="mainBtn">Continue</button>
</div>
</form>
Fiddle: http://jsfiddle.net/36zsa1t8/(我知道没有任何样式)。
表单中的“继续”按钮实际上是在提交表单,转到下一页。
代码上没有JavaScript。
知道为什么会这样吗?
如 button
的默认 type
是 submit
。
将 <Button>
标记更改为 <input type="button" value="Button">
<input type="button" class="col-md-6 formButton bigButton" value="Button">
<span>Utilizo el listado mensual de<br> consumo o límite preconcedido</span>
</input>
已更新JSFiddle