0

ユーザーによる 1 つのアクションが 2 つのイベントをトリガーするはずなのに、最初のイベントのみをトリガーするというこの問題に遭遇しています。

シナリオ:

ユーザーは focusoutのレイアウトを変更する特別なフィールドにテキストを入力し、テキストを入力した後、フィールドを離れずにボタンをクリックします。

何が起こっていますか？

テキスト ボックスに focusout イベントがあり、ボタンにクリック イベントがあります。私が見ているのは、focusout イベントは発生しますが、クリック イベントは発生しません。

これをjsfiddleにカプセル化しました：

http://jsfiddle.net/fCz6X/13/

$('#theText').focusout(function (){
    $("#focusevent").text("Focusevent");
    console.log("focus");
});

$('#theButton').click(function (){
    $("#clickevent").text("Clickevent");
    console.log("click");
});

したがって、テキスト フィールドをクリックしてからボタンをクリックすると、両方のイベントが発生すると予想されますが、フォーカス アウト イベントしか表示されません。

クリックイベントの代わりにマウスダウンイベントでボタンを起動させることでこれを一時的に修正しました（これはフォーカスアウトイベントの前に発生します）が、それは私が見たくない他の動作や問題を引き起こしています. それらのため、最適な解決策は、フォーカスアウトとクリックの両方のイベントを発生させる方法を見つけることだと思います。この問題を解決する方法について考えている人はいますか?

編集:最初の応答を確認した後、もう少し掘り下げました。ここでの問題は、focusout イベントがページ レイアウトを変更し、ボタンの位置がわずかに押し下げられていることです。フォーカスアウトが完了した後にクリック イベントがトリガーされますが、ボタンがまったく同じ場所にないため、何も起こりません。

ここに私の問題を示す更新されたフィドルがあります http://jsfiddle.net/fCz6X/11/

4

4 に答える 4

0

Joe が言ったように、ブロッキング アラート コールがイベントを壊しているものです。非ブロッキング呼び出しを使用すると、両方のイベントが表示されます。

ただし、このようなアラートを本当に実行する必要がある場合は、setTimeout() を使用して「アラート」の呼び出しを後で延期できます。

$('#theText').focusout(function (){
    setTimeout(function() { // alert after all events have resolved
        alert("focus left text box");
    }, 0);
});

編集：更新されたフィドルでは、クリックイベントが発生しない理由は、クリックイベントが発生しないためです。マウスダウン時にボタンをマウスの下から外に移動すると、「クリック」イベントを開始するフォローアップのマウスアップはありません。

設計の他の側面を再検討する必要がある場合があります。「mousedown」を使用するソリューションは、実際に発生する唯一のイベントであるため、達成できる最善の方法です。

于 2013-10-29T15:30:25.560 に答える
0

ブロックしているのは Alert です。ブラウザーのセキュリティによっては、一度に多くの window.alert が発生するのを防ぐことができます。

他のトリガーで試してみると、そう見えます。あなたは試すことができますconsole.log()

$('#theText').on("focusout",function (){
    $("#theText").val($("#theText").val()+"flb");   
});

$('#theButton').on("click",function (){
    $("#theText").val($("#theText").val()+"but");
});
于 2013-10-29T15:34:17.687 に答える