具有JQueryValidation的表单不运行validate（）函数

我在引导模式中有一个表单。此表单有两个简单输入：一个用于问题，另一个用于URL链接。它使用jQueryValidation（）执行表单验证，使用jQueryAjax提交表单操作

问题：.validate（）函数不工作/正在运行/正在执行。即使只有调试选项的简短表单也不会运行：

$("#form_pergunta").validate({
                debug: true });

例如，如果我将textarea（name=“form_question”）留空，则validate（）不会根据声明的规则发出警报

什么会阻止validate（）运行？

$(document).ready(function() {
  $.ajaxSetup({
    headers: {
      "X-CSRF-TOKEN": $('meta[name="_token"]').attr("content")
    }
  });

  $("#form_pergunta").validate({
    rules: {
      form_question: {
        required: true,
        minlength: 10,
        maxlength: 250
      },
      form_url: {
        required: false,
        minlength: 0,
        maxlength: 250,
        nowhitespace: true
      }
    },
    messages: {
      form_question: {
        required: "Por favor, digite sua pergunta.",
        minlength: "Esta não parece ser uma pergunta válida.",
        maxlength: "A pergunta não pode ter mais que 250 caracteres."
      },
      form_url: {
        maxlength: "O link não pode ter mais que 250 caracteres.",
        nowhitespace: "Não deve haver espaços no endereço digitado."
      }
    }
  });

  $("button#ajaxSubmit").click(function(e) {
    if ($("#form_pergunta").valid()) {
      jQuery.ajax({
        url: "{{ url('/question') }}",
        method: "POST",
        data: $("#form_pergunta").serialize(),
        success: function(result) {
          $("#form_pergunta")[0].reset();
          $("#myModal_Pergunte").modal("toggle");
          msgbox_Text = "Sua pergunta foi incluída com sucesso!";
          $("#msgbox_alertmsg").append(msgbox_Text);
          $("#myModal_MsgBox").modal("show");
        },
        error: function(data, textStatus, errorThrown) {
          console.log(data);
        }
      });
    }
  });
});

重要提示：除了validate（）之外，所有脚本都正常运行，甚至jQuery.ajax（）也成功运行（将表单中的数据插入Mysql ok）

HTML

标题
X
{{csrf_field（）}}
你的问题是什么？
链接选项
提交

JS:

$（文档）.ready（函数（）{
$（'button#ajaxSubmit'）。单击（函数（e）{
e、 预防默认值（）；
$（“#表格_pergunta”）。验证({
规则：{
表格(问题){
要求：正确，
最小长度：10，
最大长度：250
},
表格(网址:{
必填项：false，
最小长度：0，
最大长度：250，
nowhitespace：是的
}
},
信息：{
表格(问题){
要求：“请帮我一个忙。”，
minlength：“我的父母是瓦利达。”，
maxlength:“一个250克拉的佩尔冈塔（pergunta não pode ter mais que 250克拉）。”
},
表格(网址:{
最大长度：“O link nãO pode ter mais que 250克拉。”，
nowhitespace：“Não deve haver espaços no endereço digitado。”
}
}    
});
$.ajaxSetup({
标题：{
'X-CSRF-TOKEN'：$（'meta[name=“\u-TOKEN”]”）。attr（'content'）
}
});
jQuery.ajax({
url:“{url（'/question'）}}”，
方法：“POST”，
数据：$（'#form_pergunta'）。序列化（），
成功：功能（结果）{
$（'#form_pergunta'）[0].reset（）；
$（'myModal'u Pergunte'）.modal（'toggle'）；
msgbox_Text=“Sua pergunta foi includeída com successo！”；
$（“#msgbox_alertmsg”）.append（msgbox_文本）；
$（'myModal'MsgBox'）.modal（'show'）；
},
错误：函数（数据、文本状态、错误抛出）{
控制台日志（数据）；
},
});
});
});

脚本：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/additional-methods.min.js"></script>

---

您需要调用

valid（）

以突出显示/提醒用户。将您的实现更改为类似这样的内容

jQuery

$(document).ready(function() {
  $.ajaxSetup({
    headers: {
      "X-CSRF-TOKEN": $('meta[name="_token"]').attr("content")
    }
  });

  $("#form_pergunta").validate({
    rules: {
      form_question: {
        required: true,
        minlength: 10,
        maxlength: 250
      },
      form_url: {
        required: false,
        minlength: 0,
        maxlength: 250,
        nowhitespace: true
      }
    },
    messages: {
      form_question: {
        required: "Por favor, digite sua pergunta.",
        minlength: "Esta não parece ser uma pergunta válida.",
        maxlength: "A pergunta não pode ter mais que 250 caracteres."
      },
      form_url: {
        maxlength: "O link não pode ter mais que 250 caracteres.",
        nowhitespace: "Não deve haver espaços no endereço digitado."
      }
    }
  });

  $("button#ajaxSubmit").click(function(e) {
    if ($("#form_pergunta").valid()) {
      jQuery.ajax({
        url: "{{ url('/question') }}",
        method: "POST",
        data: $("#form_pergunta").serialize(),
        success: function(result) {
          $("#form_pergunta")[0].reset();
          $("#myModal_Pergunte").modal("toggle");
          msgbox_Text = "Sua pergunta foi incluída com sucesso!";
          $("#msgbox_alertmsg").append(msgbox_Text);
          $("#myModal_MsgBox").modal("show");
        },
        error: function(data, textStatus, errorThrown) {
          console.log(data);
        }
      });
    }
  });
});

这里，仅当表单有效时才会调用ajax POST请求方法

---

参考资料：

您的第一个错误是将

.validate（）

放入

单击
处理程序中；您不了解
.validate（）
的用途。这不是一个触发器。。。这是插件的初始化，不会进入
点击
处理程序。。第二个错误是没有使用
type=“submit”
按钮。您不需要
单击处理程序！对于Ajax，该插件包括一个
submitHandler
回调函数，当表单有效并单击按钮时，该函数将自动触发。阅读：
$(document).ready(function() {
  $.ajaxSetup({
    headers: {
      "X-CSRF-TOKEN": $('meta[name="_token"]').attr("content")
    }
  });

  $("#form_pergunta").validate({
    rules: {
      form_question: {
        required: true,
        minlength: 10,
        maxlength: 250
      },
      form_url: {
        required: false,
        minlength: 0,
        maxlength: 250,
        nowhitespace: true
      }
    },
    messages: {
      form_question: {
        required: "Por favor, digite sua pergunta.",
        minlength: "Esta não parece ser uma pergunta válida.",
        maxlength: "A pergunta não pode ter mais que 250 caracteres."
      },
      form_url: {
        maxlength: "O link não pode ter mais que 250 caracteres.",
        nowhitespace: "Não deve haver espaços no endereço digitado."
      }
    }
  });

  $("button#ajaxSubmit").click(function(e) {
    if ($("#form_pergunta").valid()) {
      jQuery.ajax({
        url: "{{ url('/question') }}",
        method: "POST",
        data: $("#form_pergunta").serialize(),
        success: function(result) {
          $("#form_pergunta")[0].reset();
          $("#myModal_Pergunte").modal("toggle");
          msgbox_Text = "Sua pergunta foi incluída com sucesso!";
          $("#msgbox_alertmsg").append(msgbox_Text);
          $("#myModal_MsgBox").modal("show");
        },
        error: function(data, textStatus, errorThrown) {
          console.log(data);
        }
      });
    }
  });
});