Javascript-jQuery验证插件规则方法不起作用

我有一个简单的javascript文件，只需要运行rules方法。不幸的是，出于某种原因，它不起作用。我知道我的自定义javascript文件呈现良好，因为输入屏蔽工作正常。我进行了双重检查，以确保呈现了jquery验证脚本，因此我不确定我的问题是什么。该项目是在Visual Studio Enterprise 2015平台上编写的简单mvc网站。网站上有问题的页面是EditInfo页面，供您参考

下面是BundleConfig.cs添加验证捆绑包

public static void RegisterBundles(BundleCollection bundles)
    {
     //More bundles obviously are added
      bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));
    }

接下来，这里是布局文件，脚本将在其中呈现

@Scripts.Render("~/bundles/jqueryval")

接下来，这里是视图中声明的2个自定义javascript文件

    <script src="@Url.Content("~/Scripts/EditInfo.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/app.js")" type="text/javascript"></script>

最后，这里是app.js文件，它包含我的javascript文件中使用的3种验证程序方法

function errorPlacementValidator(error, element) {
if (element.is(":radio")) {
    error.appendTo(element.closest("[class*='col-sm-']"));
}
else if (element.parents('.selectric-wrapper').size() > 0) {
    console.log('selectric error');
    error.appendTo(element.closest('[class*="col-sm-"]'));
}
else {
    error.appendTo(element.parent());
}
}

function highlightValidator(element, errorClass, validClass, counter) {
var $parent = $(element).parent();

// remove icon and success spans if any
$parent.find("span.form-control-feedback, span.sr-only").remove();

// add ".error" class to input element
$(element).addClass(errorClass).removeClass(validClass);

// add Bootstrap ".has-error" class to parent div.form-group element
$(element).closest(".form-group").removeClass("has-success").addClass("has-error has-feedback");

// need to have it check to see if span already added
// only add for non radio or non select input elements
if (!$(element).is(":radio, select, textarea, :checkbox, .btn") && !$(element).hasClass("datepicker")) {
    counter++;

    var $spans = $parent.find("span");

    // check to make sure error spans are not already in form-group before attempting to append after input
    if ($spans.length == 0) {
        // add span element with ".glyphicon" ".glyphicon-remove" ".form-control-feedback" classes after input
        $(element).after("<span class='glyphicon glyphicon-remove form-control-feedback' aria-hidden='true'></span>");
        $(element).after("<span id='inputError" + counter + "Status'" + " class='sr-only'>(error)</span>");
    }
}
}

function unhighlightValidator(element, errorClass, validClass, counter) {
var $parent = $(element).parent();

// remove icon and success spans if any
$parent.find("span.form-control-feedback, span.sr-only").remove();

// remove ".error" class from input element
$(element).removeClass(errorClass).addClass(validClass);

if (!$(element).is(":radio, select, textarea, :checkbox, .btn") && !$(element).hasClass("datepicker")) {
    // // remove Bootstrap ".has-error" class from parent div.form-group element
    $(element).closest(".form-group").removeClass("has-error").addClass("has-success has-feedback");

    var $spans = $parent.find("span");

    if ($spans.length == 0 && !$(element).is("select")) {
        $(element).after("<span class='glyphicon glyphicon-ok form-control-feedback' aria-hidden='true'></span>");
        $(element).after("<span id='inputSuccess" + counter + "Status'" + " class='sr-only'>(error)</span>");
    }
} else if ($(element).parents('.selectric-wrapper').size() > 0) {
    $(element).closest(".form-group").removeClass("has-error").addClass("has-success has-feedback");
}
}

函数errorPlacementValidator（错误，元素）{
if（元素is（“：radio”））{
错误.appendTo（元素.closest（“[class*='col-sm-']”）；
}
else if（element.parents（'.selectric wrapper'）.size（）>0）{
console.log（'selectric error'）；
错误.appendTo（元素.closest（'[class*=“col sm-”]）；
}
否则{
error.appendTo（element.parent（））；
}
}
函数highlightValidator（元素、errorClass、validClass、计数器）{
var$parent=$（元素）.parent（）；
//删除图标和成功跨度（如果有）
$parent.find（“span.form-control-feedback，仅限span.sr”）.remove（）；
//将“.error”类添加到输入元素
$（元素）.addClass（错误类）.removeClass（有效类）；
//将引导“.has error”类添加到父div.form-group元素
$（元素）。最近的（“.form group”）。removeClass（“有成功”）。addClass（“有错误有反馈”）；
//需要检查是否已添加了span
//仅为非单选或非选择输入元素添加
if（！$（element）.is（“：radio，select，textarea，：checkbox，.btn”）&&！$（element.hasClass（“日期选择器”））{
计数器++；
var$span=$parent.find（“span”）；
//在尝试在输入后追加之前，请检查以确保错误范围不在表单组中
如果（$spans.length==0）{
//使用“.glyphicon”“glyphicon”“remove”“.form control feedback”类在输入后添加span元素
$（元素）。在（“”）之后；
$（元素）。在（（错误）之后；
}
}
}
函数unhighlightValidator（元素、errorClass、validClass、计数器）{
var$parent=$（元素）.parent（）；
//删除图标和成功跨度（如果有）
$parent.find（“span.form-control-feedback，仅限span.sr”）.remove（）；
//从输入元素中删除“.error”类
$（元素）.removeClass（错误类）.addClass（有效类）；
if（！$（element）.is（“：radio，select，textarea，：checkbox，.btn”）&&！$（element.hasClass（“日期选择器”））{
////从父div.form-group元素中删除引导“.has error”类
$（元素）。最近（“.form group”）。removeClass（“有错误”）。addClass（“有成功有反馈”）；
var$span=$parent.find（“span”）；
如果（$spans.length==0&&！$（元素）.is（“选择”））{
$（元素）。在（“”）之后；
$（元素）。在（（错误）之后；
}
}else if（$（element）.parents（'.selectric wrapper'）.size（）>0）{
$（元素）。最近（“.form group”）。removeClass（“有错误”）。addClass（“有成功有反馈”）；
}
}

我已经在谷歌上搜索并做了研究，但我仍然无法找到原因。如果我遗漏了任何重要信息，我道歉。但是，当我输入格式不正确的电子邮件地址或短于要求的电话号码时，我正在撰写的网站仍然不会给出错误。

---

编辑：措辞使用以逗号分隔的

键：值

对列表构建

规则

对象，这些对表示字段名及其方法。方法部分的内部是另一个逗号分隔的

key:value

对列表，这些对表示方法名称及其参数。您的尝试完全缺少实际的规则（方法）

由于缺少规则列表，我也不知道是否需要字段

required

，等等。但您也需要列出这些规则

---

既然我们这么做了，为什么还要用正则表达式呢？该插件已经包含了各种电话号码和电子邮件地址的方法。参考文档并浏览附加方法文件。

您是否尝试阅读文档或查看其他示例？我可以告诉你，我从未见过这样的尝试。@Sparky“这样的尝试”是什么意思？我的尝试有什么不正常之处？（不是说粗鲁的话）我以为我是在遵循常规程序。你完全没有遵守规则本身。请看下面的答案。我不知道要使用正则表达式，模式方法是必需的，谢谢。每一条规则的禁忌是我往墙上扔东西，希望有东西卡住。我早些时候用的是正确的方法。additional-methods.js文件是否在validate捆绑包中自动呈现？或者我需要自己声明特定的脚本文件吗？最后一个问题，我是否需要“必需：true”？我不需要他们被要求，这是一个内部网站（在美国）和正则表达式和输入屏蔽应该保持在适当的长度电话号码。这个答案不是特定于ASP，这是你从来没有提到过的问题。但是，我认为您需要单独包含additional-methods.js。否则，请将该方法从该文件中复制出来并粘贴到您自己的JavaScript中。

required

规则与长度无关。它只是强制填写该字段。如果不是强制性的，那么你就不需要了。不过，在我看来，只需使用插件内置的电话和电子邮件规则即可。谢谢。很抱歉，我忘了在标题中包含ASP.Net。是的，我正在使用ASP.Net。我的措辞不好，我的意思是我不需要长度规则，但没有澄清。再次感谢你的帮助。

function errorPlacementValidator(error, element) {
if (element.is(":radio")) {
    error.appendTo(element.closest("[class*='col-sm-']"));
}
else if (element.parents('.selectric-wrapper').size() > 0) {
    console.log('selectric error');
    error.appendTo(element.closest('[class*="col-sm-"]'));
}
else {
    error.appendTo(element.parent());
}
}

function highlightValidator(element, errorClass, validClass, counter) {
var $parent = $(element).parent();

// remove icon and success spans if any
$parent.find("span.form-control-feedback, span.sr-only").remove();

// add ".error" class to input element
$(element).addClass(errorClass).removeClass(validClass);

// add Bootstrap ".has-error" class to parent div.form-group element
$(element).closest(".form-group").removeClass("has-success").addClass("has-error has-feedback");

// need to have it check to see if span already added
// only add for non radio or non select input elements
if (!$(element).is(":radio, select, textarea, :checkbox, .btn") && !$(element).hasClass("datepicker")) {
    counter++;

    var $spans = $parent.find("span");

    // check to make sure error spans are not already in form-group before attempting to append after input
    if ($spans.length == 0) {
        // add span element with ".glyphicon" ".glyphicon-remove" ".form-control-feedback" classes after input
        $(element).after("<span class='glyphicon glyphicon-remove form-control-feedback' aria-hidden='true'></span>");
        $(element).after("<span id='inputError" + counter + "Status'" + " class='sr-only'>(error)</span>");
    }
}
}

function unhighlightValidator(element, errorClass, validClass, counter) {
var $parent = $(element).parent();

// remove icon and success spans if any
$parent.find("span.form-control-feedback, span.sr-only").remove();

// remove ".error" class from input element
$(element).removeClass(errorClass).addClass(validClass);

if (!$(element).is(":radio, select, textarea, :checkbox, .btn") && !$(element).hasClass("datepicker")) {
    // // remove Bootstrap ".has-error" class from parent div.form-group element
    $(element).closest(".form-group").removeClass("has-error").addClass("has-success has-feedback");

    var $spans = $parent.find("span");

    if ($spans.length == 0 && !$(element).is("select")) {
        $(element).after("<span class='glyphicon glyphicon-ok form-control-feedback' aria-hidden='true'></span>");
        $(element).after("<span id='inputSuccess" + counter + "Status'" + " class='sr-only'>(error)</span>");
    }
} else if ($(element).parents('.selectric-wrapper').size() > 0) {
    $(element).closest(".form-group").removeClass("has-error").addClass("has-success has-feedback");
}
}

$('#yourform').validate({
    rules: {  
        fieldname1: {        // <- field NAME
            required: true,  // <- rule (method) : parameter
            phoneUS: true    // <- rule (method) : parameter
        },
        fieldname2: {        // <- field NAME
            required: true,  // <- rule (method) : parameter
            email: true      // <- rule (method) : parameter
            .....

$CreateProfilevalidator = $("#frmEditInfo").validate({
    rules: {
        personalEmail: {
            pattern: /^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,15}|[0-9]{1,3})(\]?)$/i
        },
        otherEmail: {
            pattern: /^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,15}|[0-9]{1,3})(\]?)$/i
        } 
        ....