5

私がしていること

コードの一部では、focusinイベントのリスナーがあり、別の部分では、プログラムでinput. Chrome、Safari、Firefox ではイベント リスナーが 1 回呼び出されますが、IE (IE10 を含む) では 2 回呼び出されます。jQuery でリスナーを登録し、jQuery.on()でフォーカスを設定します.focus()。この動作を示す例の完全なソースについては、以下を参照してください。必要に応じて、その例を実行できます。

質問

  1. jQueryを使用していない場合でも、IEがfocusin2回起動しています。また、フォーカスがプログラムによって設定された場合にのみ行われ、ユーザーがフィールドをタブまたはクリックした場合には行われません。なんで？それは単なる IE のバグですか、それとも IE がこのように振る舞う正当な理由があるのでしょうか?
  2. IE のバグであろうとなかろうと、ここで jQuery は IE と他のブラウザーとの違いを解決すべきではないでしょうか? つまり、jQuery のバグではありませんか?
  3. これをどのように回避しますか？(つまり、フォーカスがプログラムによって設定されているか、ユーザーによって設定されているかに関係なく、フォーカスごとに 1 回だけ実行されるコードを作成できます。)

完全なソース

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script>
            $(function() {
                $('input').on('focusin', function() {
                    var c = $('#count');
                    $('#count').text(1 + parseInt(c.text()));
                    console.log('focusin');
                });
                $('input').focus();
            });
        </script>
    </head>
    <body>
        <input>
        <code>focusin</code> received: <span id="count">0</span>.
    </body>
</html>
4

2 に答える 2

3

これは間違いなく IE の問題です。JQuery 1.9 アップグレード ガイドから:

残念ながら、Internet Explorer のすべてのバージョン (6 から 10) は、フォーカス イベントを非同期的に発生させます。IE で .trigger("focus") を実行すると、jQuery は後で発生する非同期フォーカス イベントを「認識」しないため、上記のようにフォーカス イベントが常に発生するように独自のイベントを発生させます。これにより、イベント ハンドラーが 2 回呼び出されます。この二重呼び出しを回避するには (ただし、イベント ハンドラーがまったく呼び出されないリスクがあります)、DOM フォーカス メソッドを直接使用します (例: $("selector").get(0).focus())。

私は使用$('input').get(0).focus()しましたが、ページの読み込みにあまり一貫性がありませんでした。コードをボタンに移動すると、一貫してfocusinイベントが発生しました。

于 2013-01-19T02:33:13.657 に答える
1

これには別の解決策があります。それは醜いですが、動作します。

  1. 独自の focus_handler() 関数を作成し、フォーカス イベントにバインドします。
  2. .focus() を呼び出す前にフォーカス イベントのバインドを解除します // IE はここでフォーカスを 2 回呼び出すことを覚えておいてください
  3. focus_handler を再度必要になる前に focus イベントにバインドします (例: focusout、クリック)

これは私にとってはうまくいきました。

于 2013-11-12T16:22:23.717 に答える