Question

我正在尝试解决jQuery教科书提供的问题。它读起来像这样

“即使没有输入数据也会提交数据，为了解决此问题，您必须停止提交按钮的默认操作。为此，请在if语句结尾处编写事件对象的preventDefault方法。该文件，如图10-6所示

注意*这是10-6中的代码，当我将其标记到我的代码末尾时，这对我来说不起作用，如本书所示。

if (isValid == false) { event.preventDefault(); }

请记住，您用于事件对象的名称必须与用于提交事件处理程序的参数名称相同。

注意*提交事件处理程序如下所示

    $("#email_form").submit(
    function() {
        var isValid = true;

                      // the script proceeds to validate each text field accordingly                    bla bla bla

现在，再次使用空字段进行测试。这应该在除邮政编码字段之外的每个字段的右侧显示“此字段是必需的”。“

我的问题是我的preventDefault无法正常工作，无论我尝试什么，它仍会提交。

文章中有趣的说明解释了图10-6可能有所帮助，但我不太了解如下。

“在这里，如果isValid变量为false，则表示最终的if语句为true，这意味着一个或多个字段无效。在这种情况下，将执行事件对象的preventDefault方法。此对象将传递给提交事件处理程序的函数作为参数，该参数由此处理程序中的第一行存储在事件变量中。如果在将一个或多个字段提交到服务器时未使用preventDefault方法，则表单将提交给服务器，因为那是它的默认动作。“

非常感谢任何见解。

Answer 1

event变量必须传递给您的处理程序。您的匿名函数function(){}需要接收event变量：

$("#email_form").submit(function(event){
    var isValid = true;

    // do all your validation here
    // potentially if one of the fields is empty 
    // isValid will be set to false

    if (!isValid) {
        event.preventDefault();
    }
});

Answer 2

我今天在课堂上学到了答案实际上是这样的。

$("#email_form").submit(
function(event) {
    var isValid = true;

需要在验证结束时使用我的功能（下方）......

if (isValid == false) { event.preventDefault(); }

与我的提交按钮的事件处理程序中的事件进行交互。

在提交按钮上使用preventDefault

2 个答案: