Jquery Validation Plugin 在 Chrome 中工作，但在 Mozilla 中不工作答案

【问题标题】：Jquery Validation Plugin working in Chrome, but not in MozillaJquery Validation Plugin 在 Chrome 中工作，但在 Mozilla 中不工作
【发布时间】：2020-05-20 03:16:27
【问题描述】：

我在 Django 应用程序中有一个表单，它的验证在 Chrome 上完美运行，但我无法让它在 Mozilla 上运行。我加载了这个版本的 jquery 和 jquery 验证插件

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.19.1/jquery.validate.js"></script>
<script src="https://ajax.microsoft.com/ajax/jquery.validate/1.19.1/additional-methods.js"></script>

我的 jquery 验证代码如下所示：

jQuery.validator.addMethod("phoneValidator", function(value, element) {
  return this.optional(element) || /^\+?\d?\(?([\d]{3}?)\)?-?([\d]{3}?)-?([\d]{4,5})$/.test(value);
}, 'Please enter a valid phone number. E.g. 123-456-7890');

jQuery.validator.addMethod("zipValidator", function(value, element) {
  return this.optional(element) || /(?i)^[a-z0-9][a-z0-9\- ]{0,10}[a-z0-9]$/.test(value);
}, 'Please enter a valid zip code. E.g. 80111 or 1234-80111');

jQuery.validator.addMethod("dateValidator", function(value, element) {
  return this.optional(element) || /^(0[1-9]|1[0-2])[\/|-](0[1-9]|1\d|2\d|3[01])[\/|-]([1-9]\d{3})$/.test(value);
}, jQuery.validator.format('Please enter a valid date in mm/dd/yyyy format.'));

jQuery.validator.addMethod("dateNotInFutureValidator", function(value, element) {
  //replace all dashes with /
  value = value.replace(/-/g, '\/');
  value = value.split('/');
  var today = new Date();
  var month = today.getMonth() + 1; //getMonth is 0-indexed
  var day = today.getDate();
  var year = today.getFullYear();
  // console.log(month, day, year);
  // console.log(value[0], value[1], value[2]);
  return this.optional(element) || (value[2] == year && value[0] == month && value[1] <= day) || (value[2] == year && value[0] < month) || (value[2] < year);
}, jQuery.validator.format('Please enter a date that is not in the future.'));

jQuery.validator.addMethod("allChars", function(value, element) {
  return this.optional(element) || /[a-zA-Z]+$/.test(value);
}, 'This field may only contain characters.');

jQuery.validator.addMethod("allHebrew", function(value, element) {
  return this.optional(element) || /^[\u0590-\u05FF]+$/.test(value);
}, 'This field may only contain Hebrew characters.');

FORM_RULES = {
    verify_email: { equalTo: '#id_email' },
    '{{soldier.date_of_birth.name }}' : {'dateValidator': true, 'dateNotInFutureValidator':true},
    '{{soldier.legal_first_name.name}}' : 'allChars',
    '{{soldier.legal_last_name.name}}' : 'allChars',
    '{{soldier.naaleh_selah_choice.name}}' : {
        required: function(element){
            return $('#id_naaleh_selah_bool_0').val() == 1
        }},
    accept_checkbox: {required: true}
};

FORM_MESSAGES = {
    verify_email: {equalTo: 'Please enter the same value as the Email field.'},
    accept_checkbox: {required: 'You must accept the terms and conditions to continue.'}
};


    $('#intake_form').validate({
        rules: FORM_RULES,
        messages: FORM_MESSAGES,
        errorPlacement: function(error, element)
        {

            if ( element.is(":radio"))
            {
                error.insertAfter( element.parent().parent().parent() );
            }
            else if (element.attr("id") === "accept_checkbox")
            {
                error.insertAfter(element.parent());
            }
            else { // This is the default behavior of the script
                error.insertAfter( element );
            }
        }
    });

在 Mozilla Firefox 上没有任何验证消息显示给我，它让我无需填写必填字段即可提交表单。我确实在 Mozilla 的控制台中看到以下错误：

SyntaxError: invalid regexp group

但我不确定如何处理它，因为它说错误出现在 1:1:1 - html 页面源代码中的空白行。
我确实在某处读过 Firefox 不支持后向正则表达式语法，并且 jquery 验证插件确实允许使用正则表达式，所以这两者可能不兼容？有没有办法解决这个问题？

【问题讨论】：

故障排除？出现在 DOM 中的 HTML 标记在哪里？在 DOM 中呈现的 JavaScript 在哪里？ allChars、dateValidator 和 dateNotInFutureValidator 应该代表什么？这些不是标准的 jQuery Validate 规则。如果你有一个 JavaScript 语法错误，这将是页面上所有 JavaScript 的问题。
刚刚在我上面的问题中添加了一个代码 sn-p。谢谢。
如果您不将代码片段功能放在一起以便我们运行它，那么它就毫无意义。请阅读以下内容：stackoverflow.com/help/minimal-reproducible-example 花时间将代码压缩到仍然显示问题的最低限度。谢谢。
似乎在 Firefox 中为我工作：jsfiddle.net/vuqes750 我注意到并修复的一件事是 HTML 损坏。您至少缺少一个结束 </div> 标记。如果您没有有效的 HTML，验证插件将会中断，特别是如果 <form></form> 容器被不正确的嵌套标签（例如 divs 保持打开状态）搞砸了。如果这不能解决问题，那么您将不得不花时间压缩代码并创建一个更好的演示......这里转储的多余代码太多了。

标签： jquery django jquery-validate mozilla

【解决方案1】：

问题是我的 zipValidator（发布的验证代码中的第二个方法调用）有一个 Firefox 认为无效的正则表达式。其他浏览器支持 (?i) 表示法（不区分大小写），但 Firefox 不支持。一旦我更改了该正则表达式（只是在每个 a-z 之后添加 A-Z），所有的验证、显示和隐藏都可以使用 jquery 进行。

【讨论】：