Question

我在JQuery开发方面绝对是新手，我遇到了以下问题。

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

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

单击此按钮，用户重置为执行此JavaScript函数的表单中的null 2输入：

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()
})

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

3 个答案: