0

私は Web 開発にかなり慣れていませんが、コツをつかんでいると思います。私が遭遇し続ける唯一の大きな問題は、クロスブラウザーの互換性の問題です。

ユーザーが入力を完了した後に関数を呼び出す Web ページにテキストエリアがあります。これを行うために、jQuery と setTimeout を使用して、関数を呼び出す前に少し待機しています。これにより、キーを押すたびに関数が呼び出されなくなります。関数が何らかの処理を行って返すサーブレットにリクエストを送信するため、キーを押すたびに呼び出す必要はありません。

コードは Chrome では問題なく動作しますが (デバッグには Chrome を使用します)、IE7 では動作しません。ここにあります：

var timer = null;
$("#scriptInput").keypress(function() {
    clearTimeout(timer);
    var thisEvent = window.event;
    timer = setTimeout(function() {validateScript(thisEvent);}, 500);           
});


function validateScript(evt) {
  var code = (evt.keyCode) ? evt.keyCode : evt.which;

  //check which key was pressed...
  //don't need to send a request on key presses of CAPSLOCK, SHIFT, and ARROW keys
  if(code != 20 && code != 16 && code != 37 && code != 38 && code != 39 && code !=40){ 
    sendRequest(2);
  }
}

ご覧のとおり、私はすでに IE7 との互換性を実装するために何度も試みましたが、役に立ちませんでした :\

IE7 を使用し、アップグレードする権限を持たない多くのマシンで使用されるため、少なくとも IE7 と互換性がある必要があります。

さらに情報が必要な場合はお知らせください。ありがとう！

PS "scriptInput" は、これが影響しているテキストエリアの ID です。

4

1 に答える 1

3

var thisEvent = window.event;ブラウザ間の互換性はありません。すべてのブラウザがグローバルeventオブジェクトを使用するわけではなく、代わりに関数引数を使用します。

jQuery は常にイベント オブジェクトを関数の引数として提供するため、単純に上記の割り当てを削除し、コードを次のように変更します。

$("#scriptInput").keypress(function(thisEvent) {
    ...
});

また、jQuery は、押されたキーのさまざまなプロパティを正規化するため、いつでも削除して簡単に使用e.whichできます。var code = (evt.keyCode) ? evt.keyCode : evt.which;evt.which

全体をもう少し改善/短縮することもできます。別のライブラリを追加しても問題ない場合は_.debounce、Underscore.js から使用してタイミングを調整します。

$("#scriptInput").keypress(_.debounce(validateScript, 500));

Underscore.js の代わりに、その機能を提供する jQuery プラグインを使用することもできます。

サードパーティのコードを追加することができない場合は、（おそらくグローバルな）変数の代わりに要素にタイマーを保存します。

$("#scriptInput").keypress(function(e) {
    var $this = $(this);
    window.clearTimeout($this.data('timer'));
    $this.data('timer', window.setTimeout(function() {
        validateScript(e)
    }, 500));
});
于 2012-06-21T17:34:03.267 に答える