Question

我有一个表格：

<form id="inviteForm" action="">
            <div class="modal-body">
                <label>Name</label>
                <input type="text" class="form-control mb-3" id="inputName" placeholder="Name" name="name" required>
                <label>Email</label>
                <input type="email" class="form-control" id="inputEmail" placeholder="Email" name="email" required>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-success" onclick="invite()">Invite</button>
            </div>
        </form>

您可以看到我有一个提交按钮。我喜欢“提交”按钮检查表单的有效性，但不希望在按下按钮时提交任何内容（所有操作均由vitate（）js方法处理）。

如何继续使用“提交”按钮作为表单验证器，但不提交任何内容？

Answer 1

代替使用：

onclick="invite();"

考虑使用：

onclick="return invite();"

或使用：

onclick="invite(); return false;" // This will cease the form submission at any cost.

但是，第一个选项会将invite()函数的返回值返回事件监听器。您可以使用以下简单检查来决定是否要提交：

function go() {
  return document.getElementById("chk").checked;
}

<form action="https://www.example.com/">
  <input type="checkbox" id="chk" />
  <input type="submit" value="Check to Go" onclick="return go();" />
</form>

带提交按钮的HTML表单，不刷新

1 个答案: