Javascript 如何使用jQuery validate手动触发验证？

我想手动触发验证，包括使用显示错误消息

我试图实现的场景是这样一种形式：

<form>
 <input id=i1> <button id=b1>
 <input id=i2> <button id=b2>
</form>

---

单击

b1

时，只应验证

i1

。单击

b2

时，只应验证

i2

。但是，必须过帐所有字段。我该怎么做？我考虑处理b1/b2的点击事件，并手动验证表单的一部分。

该库似乎允许对单个元素进行验证。只需将单击事件与按钮关联，然后尝试以下操作：

$("#myform").validate().element("#i1");

示例如下：

---

我的方法如下。现在我只想在单击/更改某个特定复选框时验证我的表单：

$('#myForm input:checkbox[name=yourChkBxName]').click(
 function(e){
  $("#myForm").valid();
}
)

---

或者可以简单地使用：

$（'#myElem'）.valid（）

请注意，在使用此方法检查表单之前，需要对表单调用

validate（）

文档链接：

---

我试过它在tnx@Anastasiosyal工作，我想在这个线程上分享它

我不确定当我清空字段时，输入字段是如何不触发的。但我设法使用以下方法分别触发每个必填字段：

$(".setting-p input").bind("change", function () {
        //Seven.NetOps.validateSettings(Seven.NetOps.saveSettings);
        /*$.validator.unobtrusive.parse($('#saveForm'));*/
        $('#NodeZoomLevel').valid();
        $('#ZoomLevel').valid();
        $('#CenterLatitude').valid();
        $('#CenterLongitude').valid();
        $('#NodeIconSize').valid();
        $('#SaveDashboard').valid();
        $('#AutoRefresh').valid();
    });

这是我的看法

@using (Html.BeginForm("SaveSettings", "Settings", FormMethod.Post, new {id = "saveForm"}))
{
    <div id="sevenRightBody">
        <div id="mapMenuitemPanel" class="setingsPanelStyle" style="display: block;">
            <div class="defaultpanelTitleStyle">Map Settings</div>
            Customize the map view upon initial navigation to the map view page.
            <p class="setting-p">@Html.LabelFor(x => x.NodeZoomLevel)</p>
            <p class="setting-p">@Html.EditorFor(x => x.NodeZoomLevel) @Html.ValidationMessageFor(x => x.NodeZoomLevel)</p>
            <p class="setting-p">@Html.LabelFor(x => x.ZoomLevel)</p>
            <p class="setting-p">@Html.EditorFor(x => x.ZoomLevel) @Html.ValidationMessageFor(x => x.ZoomLevel)</p>
            <p class="setting-p">@Html.LabelFor(x => x.CenterLatitude)</p>
            <p class="setting-p">@Html.EditorFor(x => x.CenterLatitude) @Html.ValidationMessageFor(x => x.CenterLatitude)</p>
            <p class="setting-p">@Html.LabelFor(x => x.CenterLongitude)</p>
            <p class="setting-p">@Html.EditorFor(x => x.CenterLongitude) @Html.ValidationMessageFor(x => x.CenterLongitude)</p>
            <p class="setting-p">@Html.LabelFor(x => x.NodeIconSize)</p>
            <p class="setting-p">@Html.SliderSelectFor(x => x.NodeIconSize) @Html.ValidationMessageFor(x => x.NodeIconSize)</p>
        </div>

@使用（Html.BeginForm（“SaveSettings”，“Settings”，FormMethod.Post，new{id=“saveForm”}））
{
地图设置
在初始导航到地图视图页面时自定义地图视图。
@Html.LabelFor（x=>x.NodeZoomLevel）
@Html.EditorFor（x=>x.NodeZoomLevel）@Html.ValidationMessageFor（x=>x.NodeZoomLevel）
@Html.LabelFor（x=>x.ZoomLevel）
@Html.EditorFor（x=>x.ZoomLevel）@Html.ValidationMessageFor（x=>x.ZoomLevel）
@Html.LabelFor（x=>x.CenterLatitude）
@Html.EditorFor（x=>x.CenterLatitude）@Html.ValidationMessageFor（x=>x.CenterLatitude）
@Html.LabelFor（x=>x.CenterLongitude）
@Html.EditorFor（x=>x.centerlongide）@Html.ValidationMessageFor（x=>x.centerlongide）
@Html.LabelFor（x=>x.nodeconsize）
@Html.SliderSelectFor（x=>x.nodeconsize）@Html.ValidationMessageFor（x=>x.nodeconsize）

和我的实体

   public class UserSetting : IEquatable<UserSetting>
    {
        [Required(ErrorMessage = "Missing Node Zoom Level.")]
        [Range(200, 10000000, ErrorMessage = "Node Zoom Level must be between {1} and {2}.")]
        [DefaultValue(100000)]
        [Display(Name = "Node Zoom Level")]
        public double NodeZoomLevel { get; set; }

        [Required(ErrorMessage = "Missing Zoom Level.")]
        [Range(200, 10000000, ErrorMessage = "Zoom Level must be between {1} and {2}.")]
        [DefaultValue(1000000)]
        [Display(Name = "Zoom Level")]
        public double ZoomLevel { get; set; }

        [Range(-90, 90, ErrorMessage = "Latitude degrees must be between {1} and {2}.")]
        [Required(ErrorMessage = "Missing Latitude.")]
        [DefaultValue(-200)]
        [Display(Name = "Latitude")]
        public double CenterLatitude { get; set; }

        [Range(-180, 180, ErrorMessage = "Longitude degrees must be between {1} and {2}.")]
        [Required(ErrorMessage = "Missing Longitude.")]
        [DefaultValue(-200)]
        [Display(Name = "Longitude")]
        public double CenterLongitude { get; set; }

        [Display(Name = "Save Dashboard")]
        public bool SaveDashboard { get; set; }
.....
}

公共类用户设置：IEquatable
{
[必需（ErrorMessage=“缺少节点缩放级别”。）]
[范围（20010000000，ErrorMessage=“节点缩放级别必须介于{1}和{2}之间。”）]
[默认值（100000）]
[显示（Name=“节点缩放级别”）]
公共双节点oomlevel{get；set；}
[必需（ErrorMessage=“缺少缩放级别”。）]
[范围（20010000000，ErrorMessage=“缩放级别必须介于{1}和{2}之间。”）]
[默认值（1000000）]
[显示（名称=“缩放级别”）]
公共双ZoomLevel{get；set；}
[范围（-90,90，ErrorMessage=“纬度必须在{1}和{2}之间。”）]
[必需（ErrorMessage=“缺少纬度”。）]
[默认值（-200）]
[显示（名称=“纬度”）]
公共双中心纬度{get；set；}
[范围（-180，180，ErrorMessage=“经度必须在{1}和{2}之间。”）]
[必需（ErrorMessage=“缺少经度”。）]
[默认值（-200）]
[显示（Name=“经度”）]
公共双中心经度{get；set；}
[显示（Name=“保存仪表板”）]
公共bool SaveDashboard{get；set；}
.....
}

从1.14版开始，有一种未记录的方法

validator.checkForm()

---

此方法以静默方式验证是否返回true/false。它不会触发错误消息。

如果您对表单上的参数使用

validate（）

，并且希望在以后手动验证表单的一个字段，则有一种好方法：

var validationManager = $('.myForm').validate(myParameters);
...
validationManager.element($(this));

---

文档：

在我的类似案例中，我有自己的验证逻辑，只想使用jQuery验证来显示消息。这就是我所做的

//1）启用jQuery验证
var validator=$（'#myForm'）.validate（）；
$（“#myButton”）。单击（函数（）{
//这里是我自己的验证逻辑
//.....
//2） 验证失败时，手动显示错误消息
验证器({
“myField”：“我的自定义错误消息”
});
})；

如中所述，以编程方式触发表单验证的方法是调用validator.form（）

---

伊娃M来自上面，几乎得到了上面发布的答案（谢谢伊娃M！）：

这几乎就是答案，但即使是截至2018年12月13日最新的jquery验证插件也会出现问题。问题是，如果直接复制该样本，并多次调用“.validate（）”，验证的焦点/关键点处理可能会中断，验证可能无法正确显示错误

以下是如何使用Eva M的答案，并确保不会出现焦点/关键点/错误隐藏问题：

1） 将验证程序保存到变量/全局

var oValidator = $("#myform").validate();

2） 不要再调用$（“#myform”）.validate（）

如果多次调用$（“#myform”）.validate（），可能会导致焦点/键/错误隐藏问题

3） 使用变量/全局和调用窗体

var bIsValid = oValidator.form();

---

为什么不手动验证它呢？这个插件对于验证整个表单非常有用，但在这种情况下更适合手动验证表单。表单比我的示例中的表单大。我希望它是自动的。这验证整个表单…为了只验证1个字段，正确的方法是：无论出于什么原因，我在验证时都不会得到自定义错误文本这样。可能与我在Durandal对话框中运行有关。在所述上下文中，此框架存在大量问题。@Roberto Aloi:Link已弃用

validate（）

需要在

var validator = $( "#myform" ).validate();
validator.form();

var oValidator = $("#myform").validate();

var bIsValid = oValidator.form();