jQueryでのリンク最初のクリックで検証エラーメッセージが機能しない

Question

jQuery検証（つまり、https://jqueryvalidation.org/）エラーメッセージをカスタマイズしてリンクを含めると、

$("form").validate({ 
    messages: { 
    foo: { 
     required: 'This field is required, <a href="#" onclick="alert(0); return false;">click here to find out why</a>', 
    } 
    } 
}); 

リンクは最初のクリックでは機能しません.2回目以降はリンクが機能しません。ここ

デモ：http://jsfiddle.net/jo6myLf9/

何が起こっていますか？

Answer 1

上記のコメントには、フォーカス問題があるようです。

あなたがfocusInvalidオプションを含めると、ドキュメントごとに、あなたの問題を引き起こしている「無効に無効な要素の集束」falseに設定することができます。

focusInvalid: false 

全コード：

$("form").validate({ 
    focusInvalid: false, 
    messages: { 
    foo: { 
     required: 'This field is required, <a href="#" onclick="alert(0); return false;">click here to find out why</a>', 
    } 
    } 
}); 

Fiddle

要素の焦点は、あなたとあなたのアプリケーション（？UX）にとって重要である場合は、これはあなたを助けにはなりません。

Answer 2

シングルクリックでアラートの期待される結果を達成し、オプションのonclick機能で

 $("form").validate({ 
     focusInvalid: false, 
     messages: { 
      foo: { 
      required: 'This field is required, <a href="#" onclick="alert(0);$(\'#foo\').focus(); return false;">click here to find out why</a>', 
      } 
     } 
     }); 

以下そのアラート使用後に専念するために、私はその入力フィールドとfocusInvalidにバックフォーカス設定：falseが単一に警告が表示されますこれはあなたのために働く参照

ホープhttp://jsfiddle.net/Nagasai_Aytha/6oer7bkg/2/ - すべてのシナリオ

JSFiddleをカバーするであろう、クリックしてください。