さまざまなブラウザと互換性のある jQuery.event イベントの詳細な分析_jquery

WBOY
リリース: 2016-05-16 17:08:31
オリジナル
1014 人が閲覧しました

導入の前に、jQuery のメソッド jQuery.event.fix(event || window.event); を紹介します。イベントが jQuery メソッドを通じてバインドされている場合、このメソッドはブラウザのイベント オブジェクトを jQuery.event に変換します。変換する必要はありません!

JQuery は、W3C 仕様に従いながらイベントの共通属性をカプセル化するため、ブラウザーの種類を判断する必要なく、すべての主要なブラウザーでイベント処理を正常に実行できます。

1.event.type 属性
このメソッドは時間のタイプを取得するために使用されます

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

$("a").click(function(event){
alert(event.type); //時間の種類を取得します
return false ; //リンクジャンプを防止します
})

上記のコードが実行されると、「click」が返されます。

2.event.preventDefault() メソッド
このメソッドの機能は、デフォルトのイベント動作を防止することです。 W3C 仕様に準拠した JavaScript のPreventDefault() メソッドは、IE ブラウザでは無効です。 jQuery はそれをカプセル化して、さまざまなブラウザーと互換性を持たせます。

3.event.stopPropagation() メソッド
このメソッドはイベントのバブリングを防ぐためのものです。 W3C 仕様に準拠した JavaScript の stopPropagation() メソッドは、IE ブラウザでは無効です。 jQuery はそれをカプセル化して、さまざまなブラウザーと互換性を持たせます。

4.event.target 属性
event.target 属性の機能は、イベントをトリガーする要素を取得することです。 jQuery がそれをカプセル化すると、W3C、IE、Safari ブラウザーのさまざまな標準間の違いが回避されます。

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

$("a[href=http: //www .jb51.net]").click(function(event){
alert(event.target.href); //イベントをトリガーした 要素の href 属性値を取得します
alert(event.target .tagName); //イベントをトリガーした要素のタグ名を取得します
return false})

5. event.popularTarget 属性
標準 DOM では、マウスオーバーとマウスアウトが発生する要素には、event.target() メソッドを通じてアクセスでき、関連要素には、event.popularTarget 属性を通じてアクセスできます。マウスオーバーのevent.relativeTarget属性はIEブラウザのevent.fromElement属性に相当し、マウスアウトの場合はIEブラウザのevent.toElement属性に相当するものをjQueryでカプセル化し、様々なブラウザと互換性を持たせています。

6.event.pageX/event.pageY 属性
このメソッドの機能は、ページに対するカーソルの x 座標と y 座標を取得することです。 jQueryを使用しない場合、IEブラウザではevent/event.yメソッドが使用され、Firefoxブラウザではevent.pageX/event.pageYメソッドが使用されます。ページにスクロール バーがある場合は、スクロール バーの幅と高さを追加します。 IE ブラウザでは、デフォルトの 2px の境界線も減算する必要があります。

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

$(function() {
$(" a").click(function(event) {
alert("Current Mouse Position:"event.pageX","event.pageY);
//マウスの現在の相対座標を取得します。ページ
return false; //リンクジャンプを防止します
});
})

7.event.that 属性
関数このメソッドは、マウスを使用して、クリック イベントで左、中、右のマウス ボタンを取得し、キーボード イベントでキーボード ボタンを取得します。
コードをコピー コードは次のとおりです。

$(function() {
$(" body").mousedown(function(e) {
alert(e.that); //1 = マウスの左ボタン; 2 = マウスの中ボタン; 3 = マウスの右ボタン。
})
})

マウスでページをクリックすると、左、中、右のキーをクリックして、それぞれ 1、2、3 を返します。

8.event.metaKey プロパティ
キーボードの キーの異なるブラウザーの解釈に従って、jQuery もそれをカプセル化し、event.metaKey() メソッドを指定します。キーボードとしてイベント内の キーストロークを取得します。

9.event.originalEvent プロパティ。
このメソッドの機能は、元のイベント オブジェクトを指すことです。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート