如何防止JQuery按钮提交我的表单？

Question

我绝对不是JQuery开发的新手，但是我遇到以下问题。

我有一个包含此JQuery按钮的表单：

<!-- RESET BUTTON: -->
<td>
    <button class="resetButton" name="submitReset" onclick="return resetSearch(); return false;">Reset</button>
</td>

单击此按钮，用户将设置为null的2个输入重置为我的表单中执行此JavaScript功能的输入：

function resetSearch() {
    var f = document.getElementById('dataDaAForm');
    f.dataDa.value = null;
    f.dataA.value = null;
    event.preventDefault();
}

该脚本已执行，但问题是在此之后它从上一个函数中消失了，无论如何都提交了表单，并且我不希望这种行为发生。

当用户单击“ 重置”按钮时，如何防止提交表单？ 如您所见，我也尝试添加此语句，但它不起作用：

event.preventDefault();

我想念什么？ 如何解决此问题？

另一个问题是：重置表单输入标签值的正确方法吗？

TNX

Answer 1

试一试-您需要将事件传递给函数。 此外，我不再需要内联JS。

$(".resetButton").click(function(e) {
    var f = document.getElementById('dataDaAForm');
    f.dataDa.value = null;
    f.dataA.value = null;
    e.preventDefault();
});

除了防止默认设置外，Javascript还提供了一种重置表单的方法：

$(".resetButton").click(function(e) {
    document.getElementById("dataDaAForm").reset();
    e.preventDefault();
});

注意：您标记了jquery，所以我提供了一个jquery解决方案（尽管您的问题中没有jquery）。

Answer 2

创建重置按钮的最简单方法是输入类型重置：

<input type="reset" value="Reset" />

尽管如果您真的想用JavaScript做到这一点，James Hill的答案就足够了

Answer 3

尝试这个

var form = $('#dataDaAForm')

$(".resetButton").on("click",function(e) {
    form.reset()
    e.preventDefault()
    e.stopPropagation()
})