在提交按钮上使用preventDefault

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语句,这意味着一个或多个字段无效.在这种情况下,执行事件对象的preventDefault方法.这个对象被传递给函数for提交事件处理程序作为参数,由此处理程序中的第一行存储在事件变量中.如果在将一个或多个字段提交到服务器时未使用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();
    }
});