IEおよびFF_javascriptスキルでのonchangeイベントのパフォーマンスと解決策について

最近のプロジェクトには、ページにチェックボックスがあり、ユーザーがチェックボックスを選択または選択解除すると、jsonp リクエストがバックグラウンドに送信されます。当時の実装では、このチェックボックスに onchange イベントを追加するという想定外の結果が得られました。そのため、詳しく調査したところ、IE および FF での onchange イベントのパフォーマンスに次のような問題があることがわかりました。

問題①: FFでは、チェックボックスの選択状態が変更されると、即座にonchangeイベントが発生します。ただし、IE でチェックボックスの選択状態を変更する場合、onchange イベントはすぐにはトリガーされず、チェックボックスがフォーカスを失った後にイベントがトリガーされます。

この問題を解決するために、チェックボックスの onclick イベントに this.blur() ステートメントを追加しました。これは、onclick イベントが onchange イベントよりも前に実行されるため、Onclick に this.blur() ステートメントを追加しました。チェックボックスがフォーカスを失うと、onchange イベントがすぐに発生します。しかしその後、2 つ目の問題が発生しました。

問題②: onclick イベントと this.blur を同時に使用すると、IE でエラーが報告されます。

インターネットで情報を検索し、最終的に onpropertychange イベントを見つけました。このイベントは FF ではトリガーされません。 IEではチェックボックスの選択状態が変わるとすぐに起動します。したがって、最終的な解決策に到達しました。IE では onpropertychange イベントをチェックボックスにバインドし、FF では onchange イベントをチェックボックスにバインドします。

具体的なコード実装は次のとおりです:

コードをコピー コードは次のとおりです:

var ua=navigator .userAgent.toLowerCase();
var s=null;
var browser={
msie:(s=ua.match(/msies*([d.] )/ ))?s[1 ]:false,
firefox:(s=ua.match(/firefox/([d.] )/))?s[1]:false,
chrome:(s= ua.match(/chrome /([d.] )/))?s[1]:false,
opera:(s=ua.match(/opera.([d.] )/))?s [1]:false,
safari:(s=ua.match(/varsion/([d.] ).*safari/))?s[1]:false
}; browser.msie){/ /IE ブラウザの場合
checkbox.onpropertychange=function(){
//何かする
}
}
else{
checkbox.onchange= function(){
//何かをします
}
}