JQuery 验证未触发答案

【问题标题】：JQuery Validation not triggeringJQuery 验证未触发
【发布时间】：2011-01-24 23:57:54
【问题描述】：

我在我的编程逻辑中做了某种失礼。请评估以下内容：

<form id="LeadForm" method="post" action="">
  <div id="lead_form_step_1">
  <asp:Label ID="lblProgramOfInterest" class="lead_form" runat="server" Text="Program of Interest"></asp:Label><asp:DropDownList ID="ddlProgramOfInterest" runat="server"></asp:DropDownList>
  <p />

  <span class="next">Next &gt;&gt;</span>
  </div>

  <div id="lead_form_step_2">
  <div class="lead_form">First Name:<input type="text" id="NameFirst" class="required" minlength="2"/></div>
  <div class="lead_form">Last Name:<input type="text" id="NameLast" /></div>
  <div class="lead_form">Address:<input type="text" id="AddressLine1" /></div>
  <div class="lead_form">Address:<input type="text" id="AddressLine2" /></div>
  <div class="lead_form">City:<input type="text" id="AddressCity" /></div>
  <div class="lead_form">State:<input type="text" id="AddressState" /></div>
  <div class="lead_form">Zip Code:<input type="text" id="AddressZip" /></div>
   <p />
  <span class="prev">&lt;&lt; Previous</span>&nbsp;&nbsp;<span class="next">Next &gt;&gt;</span>
  </div>

  <div id="lead_form_step_3">
  <div class="lead_form">Email:<input type="text" id="EmailAddress" /></div>
  <div class="lead_form">Phone:<input type="text" id="HomePhone" /></div>
  <div class="lead_form">Mobile:<input type="text" id="MobilePhone" /></div>
  <div class="lead_form">Inquired Before:<input type="checkbox" id="InquiredBefore" /></div>
  <br /><span class="prev">&lt;&lt; Previous</span> &nbsp;<span class="leadsubmit">Submit</span>

 </div>
 </form>

以下是 JQuery 验证器和 div-switcher：

$('#lead_form_step_2 .prev').click(function (event) {
    $('#LeadForm').validate();
    $('#lead_form_step_2').hide();
    $('#lead_form_step_1').show();
});

$('#lead_form_step_2 .next').click(function (event) {
    $('#LeadForm').validate()
    $('#lead_form_step_2').hide();
    $('#lead_form_step_3').show();
});

我在这里不确定的是，当我单击下一个/上一个链接时，validate() 方法不会停止表单的进程。事实上，它根本没有验证。我正在使用this 教程，我错过了什么？

【问题讨论】：

我发现除非我在字段中添加“名称”属性，否则我的验证不起作用。
有意思，你用的是什么 jquery 验证器插件？
我使用的是 ASP.NET MVC 3 模板之一附带的 jquery 实现。（jQuery-1.5.1）。我在 JS 中使用自定义验证器代码，而不仅仅是让 jquery 根据 CSS 类确定验证规则。 耸耸肩这是我第一次使用它，所以也许我忽略了其他一些因素。
我使用的库似乎是一个相当受欢迎的库bassistance.de/jquery-plugins/jquery-plugin-validation 我已经推出了自己的库，并在每个实例的基础上使用它作为它大约 50 个正则表达式的集合，我可以根据需要映射它们。

标签： javascript asp.net jquery validation

【解决方案1】：

我相信你想要做的是将你的$('#LeadForm').validate() 包装在一个条件语句中，如果它验证则返回 true，否则返回 false。您的 .next click 事件可以像这样改变

$('#lead_form_step_2 .next').click(function (event) {
 if($('#LeadForm').validate())
 {
 $('#lead_form_step_2').hide();
 $('#lead_form_step_3').show();
 }
 else return false;
});

【讨论】：

它仍然没有触发 NameFirst 字段的空白输入。或者根本就没有。在 JS 中设置断点没有触发。
是对包含在您的 aspx 文件中的验证插件的引用
是的，它显示为已加载 200 OK萤火虫网面板

【解决方案2】：

我相信它停止的原因是因为 .validate() 函数有一个 return 正在停止进展。也许在提交表单时执行验证会更好，或者像这样对每个输入元素进行模糊/更改？

$('input,select').blur(function { $('#LeadForm').validate(); });

这样在更改或取消选择每个元素后，您要再次验证表单吗？

希望这会有所帮助！

验证（[选项]）

此方法为提交、聚焦、keyup、模糊和单击设置事件处理程序，以触发整个表单或单个元素的验证。每一项都可以禁用，见 onxxx 选项（onsubmit、onfocusout、onkeyup、onclick）。 focusInvalid 在提交无效表单时聚焦元素。

【讨论】：

【解决方案3】：

在我的情况下，当前页面中有多个表单，我正在使用：

$('form').validate()

这让 jQuery.validate 感到困惑。

解决方案：为您的表单分配一个指定的 ID 选择器。例如

$('#my_form_id').validate()

【讨论】：