如果您返回 false，在使用 ajax 时可以在表单中使用提交按钮吗？答案

【问题标题】：Is it okay to have the submit button in a form when using ajax if you're returning false?如果您返回 false，在使用 ajax 时可以在表单中使用提交按钮吗？
【发布时间】：2013-05-13 10:55:44
【问题描述】：

下面的代码从表单中获取输入并从处理程序中获取结果。此电子邮件发送并正常工作；但是，我的代码是否不正确，因为我有提交按钮而不是按钮？我认为这没关系，因为我在 click 函数中返回 false。也许使用按钮值会是一个更好的主意，并在表单中取出操作，因为它已经在 ajax 中？

<div id="result">
</div>
<form action="handler.php" id="contact-form">
    <input type="text" name="name" class="clear">
    <input type="text" class="clear">
    <textarea name="message" class="clear">
    </textarea>
    <input type="submit" value="Send" id="submit-form">
</form>

$("#submit-form").click(function() {
    $.ajax({
        type: "POST",
        url: "handler.php",
        data: $("#contact-form").serialize(),
        success: function(response) {
            $('#result').html(response);
        }
    });
    return false;
});

【问题讨论】：

如果用户在其中一个输入时按下 Enter 键会怎样。这不会触发您的点击处理程序，而是像往常一样将您的表单提交给 handler.php。
@pXL 啊，我明白了，我只是尝试在输入时提交表单，但一切仍然照常工作，而不是去处理程序，因为我在处理程序中回显了一些东西。如果它转到处理程序，它将是一个带有段落的空白页；相反，我用 ajax 得到了结果。这只是浏览器的事情吗？

标签： jquery ajax forms button submit

【解决方案1】：

不仅可以通过单击提交按钮，还可以通过在关注输入类型文本时按下Enter 键或通过在控制台中键入类似：document.forms['your_form'].submit(); 来汇总表单。因此，您必须在表单元素上添加事件，如下所示：

$("#your_form_id").on("submit", function (e) {
    e.preventDefault();
    e.returnValue = false;

    // your code here

    return false;
})

【讨论】：

谢谢，从现在开始我会这样做！