Asp.net mvc 使用屏蔽插件时，Jquery验证停止对输入工作

控制器

public class HomeController : Controller
{
    public ActionResult Index()
    {
        TestModel model = new TestModel();
         return View(model);
    }
}

型号

public class TestModel
{
    [Required(ErrorMessage="You have to put a first name!")]
    [StringLength(maximumLength: 24)]
    [Display(Name="First Name")]
    public string FirstName { get; set; }

    [Required(ErrorMessage = "Yo the last name is required!")]
    [StringLength(maximumLength: 24)]
    public string LastName { get; set; }

    [Required]        
    public string PhoneNumber { get; set; }

    [Required]
    public string ZipCode {get; set;}
}

查看

<h2>Test</h2>

@using(Html.BeginForm())
{
    @Html.LabelFor(model => model.FirstName)
    @Html.TextBoxFor(model => model.FirstName)
    @Html.ValidationMessageFor(model => model.FirstName)
    <br />
    @Html.LabelFor(model => model.LastName)
    @Html.TextBoxFor(model => model.LastName)
    @Html.ValidationMessageFor(model => model.LastName)
    <br />
    @Html.LabelFor(model => model.PhoneNumber)
    @Html.TextBoxFor(model => model.PhoneNumber)
    @Html.ValidationMessageFor(model => model.PhoneNumber)
    <br />
    @Html.LabelFor(model => model.ZipCode)
    @Html.TextBoxFor(model => model.ZipCode)
    @Html.ValidationMessageFor(model => model.ZipCode)
    <br />
    <input type="submit"/>
}

    <!-- JS includes -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

    <script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
    <script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>
    <script type="text/javascript">
        //  Masked plugin script here, linking to site doesn't work
    </script>
    <script type="text/javascript">    
        $(document).ready(function () {
        //  Validation works when masks are commented out
            $("#PhoneNumber").mask("(999) 999-9999");
            $("#ZipCode").mask("99999");
        });
    </script>

测试
@使用（Html.BeginForm（））
{
@LabelFor（model=>model.FirstName）
@Html.TextBoxFor（model=>model.FirstName）
@Html.ValidationMessageFor（model=>model.FirstName）


@LabelFor（model=>model.LastName）
@Html.TextBoxFor（model=>model.LastName）
@Html.ValidationMessageFor（model=>model.LastName）


@LabelFor（model=>model.PhoneNumber）
@Html.TextBoxFor（model=>model.PhoneNumber）
@Html.ValidationMessageFor（model=>model.PhoneNumber）


@LabelFor（model=>model.ZipCode）
@Html.TextBoxFor（model=>model.ZipCode）
@Html.ValidationMessageFor（model=>model.ZipCode）


}
//屏蔽插件脚本在这里，链接到网站不工作
$（文档）.ready（函数（）{
//当掩码被注释掉时，验证工作
$（“#电话号码”）.mask（“（999）999-9999”）；
$（“#ZipCode”）.mask（“99999”）；
});

.Net小提琴

问题

如果对mask插件的两个调用被注释掉，那么验证工作正常。这意味着如果我：

在“名字”和“姓氏”文本框中输入内容，然后

选项卡从每个框中取出并返回，然后单击delete以清除 内容

出现验证消息，告诉我这些字段是必需的

如果我取消对mask插件的两个调用的注释并重复上述两个步骤，其中一个文本框（第一个或最后一个）将不会显示其验证消息

---

有人能告诉我为什么会发生这种情况，以及如何避免这种情况吗？

我无法找出原因，但在我们能够找到更好的库环境之前，我最终要做的是处理表单输入的输入事件，并将它们标记为脏，并验证它们是否：

$("#myForm input").on("input", function () {
    $("#myForm").data("validator").element(this);
});

---

我没有答案，但我可以告诉你一些疑难解答。使用和不使用掩码插件检查DOM。有什么区别？您不需要查看整个页面，只需关注单个

输入的差异。jQuery验证插件需要
name
属性进行验证。因此，如果掩码插件干扰了这一点，或者创建了第二个隐藏的
输入
元素，那么您最好不要使用
不引人注目的
插件。毕竟，如果你必须做所有这些额外的编程，“低调”是没有意义的。哦，我尝试了所有这些。它们是相同的。此外，如果你查看我发布的简化小提琴链接，你可以查看我的问题的复制品。我想我不理解你的问题。我尝试了你的JSFIDLE，有屏蔽插件和没有屏蔽插件……这两种方式的表现似乎完全相同。你到底在哪里看到这个问题？哪种浏览器版本？当我转到我发布的小提琴并确保遮罩线没有被注释（它们不应该被注释）时，我将文本放在第一个和第二个框中。然后我从两个框中删除文本。一个显示一条验证消息，另一个不显示它们都应该显示的时间。你没有得到同样的结果吗？另外，我正在使用chrome。我试着再次发表评论，现在它仍在这样做。奇怪的所以问题是，为什么不管事情是否被评论，它都不起作用？