jQueryぼかしと送信伝播の問題

Question

私は、 "表示名"入力フィールドを持つシンプルな新しいユーザーフォームを使用して、blur（）イベントでajax呼び出しをトリガーします。入力された値がすでにDBに存在するかどうかを確認します。

例：表示名は、ユーザーがフォーム内の次の迅速な行動である、さらに進行して「送信」ボタンをクリックする与えられている

$("#displayname").blur(function() { 
    //do something 
}) 

たら。

例：

$("#button").click(function() { 
    $("#form").trigger("submit"); 
}) 

しかし、ブラー（）イベントは、常に最初のトリガーとボタンクリックが登録されていません。ボタンの2回目のクリックだけで伝播が正しいようになります。これは私の形で混乱を引き起こしています。

私はボタンをクリックすると、テキストボックスのblur（）イベントを抑制するための方法はありますか？

ありがとうございました。何か助けをありがとうございました 乾杯！

Answer 1

私が正しく理解している場合、問題のシナリオは、blurがボタンクリックによって発生した場合です。

幸い、イベント情報はハンドラに渡され、イベントにはtargetプロパティが含まれている必要があります。それで、blurについて何かするかどうかを推論することができます。お気に入りのjsデバッガを使用してblurイベントハンドラを停止し、targetプロパティの内容を確認してください。

$("#displayname").blur(function(evt) { 
    if (evt.target is not the button){ // figure this out with debugger 
     //do something 

     return true; // I handled it 
    } 
    return false; // I didn't handle it 
}) 

ただし、このシナリオでは、フィールドにあるものがデータベースにないことを動的にチェックしません。

@eZaktoは、入力のajaxチェックが完了するまで、送信ボタンを無効にすることをお勧めします。

Answer 2

あなたは 'event.relatedTarget'を探しています。 focusOutまたはblurイベントの場合、これはフォーカスを受け取る要素に設定されます。したがって、あなたは、送信ボタンのクリックによるぼかしであり、他のイベントではないことがわかります。

$("#displayname").blur(function(event) { 
    if (event.relatedTarget && (event.relatedTarget.id === 'button')){ 
     $("#button").trigger('click'); 
    } 
    else { 
     // do blur stuff here 
    } 
});