2 个按钮激活表单提交答案

【问题标题】：2 buttons activating form submission2 个按钮激活表单提交
【发布时间】：2021-08-10 10:36:50
【问题描述】：

我的表单中有 2 个按钮，1 个用于提交，1 个用于转到上一页，但两者都做同样的事情。这是怎么回事？

            <div style="position:fixed; left: 50px; top:13%; z-index: 100;">
                <a href="index.php<?=$link?>"><button class="btn btn-warning">Terug</button></a>
                <button type="submit" name="submit" class="btn btn-success">Volgende</button>
            </div>

【问题讨论】：

标签： html forms bootstrap-4

【解决方案1】：

Html 按钮有几种类型

type='button', type='reset', type='submit'

好的，这些有什么作用？

type='button'，你的意思是它是一个普通的按钮，没有任何作用

type='submit' 是指提交表单的按钮

type='reset' 是指重置表单字段值的按钮。

没有类型，自动默认为type='submit'。

<div style="position:fixed; left: 50px; top:13%; z-index: 100;">
                <a href="index.php<?=$link?>"><button class="btn btn-warning">Terug</button></a>
                <button type="submit" name="submit" class="btn btn-success">Volgende</button>
            </div>

您可以将type='button' 添加到您想要正常的按钮或

您可以添加一些 javascript 使其不像提交按钮。

<button class="btn btn-warning" onclick='event.preventDefault()'>Terug</button>

【讨论】：

【解决方案2】：

做了一个有效的修复，但仍然不知道为什么：我将第一个 <button> 更改为 <div>，现在它们按预期工作：

<a href="index.php<?=$link?>"><div class="btn btn-warning">Terug</div></a>
<button type="submit" name="submit" class="btn btn-success">Volgende</button>

【讨论】：

自从您删除了按钮后，它就可以工作了。如果需要，您必须将 type="button" 放在取消按钮上。或者你可以处理一些 js 来代替按钮点击