jQuery:按钮原因验证

Question

在我的表单中，我有一个普通的提交按钮，用于验证我的表单，例如，我有

$("#formTest").submit(function (e) {
        alert('test');
});

<form id="formTest">
    <input type="text"/>
    <button>Test</button>
    <input id="submitButton" type="submit" value="Save" />
</form>

但是当我单击“测试”(而不是“保存”按钮)时，会显示alert()。这是一个简单的示例，但就我而言，jQuery 会验证我在这种情况下的所有输入。

如何才能有一个没有提交效果的按钮？

比你强

Answer 1

基本上这与验证无关。这只是纯粹的表单提交。为了防止您的表单在单击“测试”按钮时提交，您应该向其附加一个单击事件处理程序并取消事件的传播。

$("button").click(function(evt){
    evt.preventDefault();
    return false;
});

为什么会发生这种情况？

问题是，当您单击测试按钮时，您的表单将被提交，因为默认按钮类型(在您的情况下未提供时)将为提交。检查W3C Specification .

这仅仅意味着通过提供 type="button" 也会改变此提交行为。但这取决于手头的问题(显然不是简化示例中提出的问题)。