Question

与何时展示我的错误消息进行斗争。我的代码如下，但基本上，表单应该验证BLUR上的输入字段。这在很大程度上是可以接受的。

我需要做的只是让验证显示为模糊，如果他们点击的下一个东西不是该字段旁边的帮助图标。

我的客户回来说，如果他们选择了一个字段，那么这不是一个好的用户旅程，然后让它点击帮助（触发模糊功能），当他们点击帮助时，因为该字段失去焦点，它尝试验证它，并且在没有实际输入任何内容的情况下给用户提供错误消息。

在尝试验证之前，我无法检查字段是否为空，因为它是必填字段，如果字段为空，我还需要出现错误。

这有点难以解释，但希望我已经做好了。

HTML

    <div class="question" id="PD_email">

 <label>Email address</label>
 <input class="v-middle jsValid_email" id="email" type="text" size="50" />
 <label class="inline helpTrigger cursor">Why do we ask for this?</label>

 <div class="hidden help rounded03 aboveTrigger" style="left:385px;" id="emailAddress_help">
  HELP MESSAG IN HERE
 </div>

 <div class="error hidden">
  ERROR MESSAGE IN HERE
 </div>

</div>

<div class="question" id="PD_phone">

 <label>Phone number</label>
 <input class="v-middle jsValid_phone" id="phone" type="text" size="50" />
 <label class="inline helpTrigger cursor">Why do we ask for this?</label>

 <div class="hidden help rounded03 aboveTrigger" style="left:385px;" id="emailAddress_help">
  HELP MESSAGE IN HERE
 </div>

</div>

jQUERY SCRIPT

 $('input').blur(function() { 
         if ($(this).hasClass('jsValid_email')){
     if (($(this).val()=='') && ($(this).hasClass('jsOptional')))
  {/* do nothing*/}
  else {
  email(this.id);
        }

然后调用一个函数来验证特定类型的输入字段（电子邮件，电话，alpha，dob等等）然后如果验证失败则验证ON BLUR，它会将字段和标签着色为红色。

所以如果有任何方法可以编写if（！（$（this）.siblings（'。help'）。click（）））类型事件，那会很方便！

谢谢，凯文

Answer 1

模糊事件不知道你要去哪里，所以这不可能以这种方式完成。您需要稍后进行验证，我可以看到两个选项：

的setTimeout。稍后运行验证，并希望帮助按钮上的Focus事件已经运行，这应标记验证不应发生。这是有风险的，但很难实现。
对每个其他控件聚焦事件执行验证调用，以便在它发生时，您知道哪个控件具有焦点。如果您有大型或复杂的表单，并且无法轻松识别其他所有控件，则会出现此问题。您应该在指定字段的Focus事件上标记这需要验证（而不是模糊，因为事件顺序没有定义或一致），并且只在需要时才处理它。

当然，在这两种情况中，您都必须将焦点设置回失败的控件。如果您在多个控件上需要这个，那么最好的选择是提交验证，即使他们可能对此不满意。试图在多个控件上处理这种处理的复杂性将会让我感到高兴。

（是的，我知道你现在可能已将它排序，但对于其他任何人，他们可能会感兴趣）

jQuery验证和用户旅程

1 个答案: