jqueryの基本的なイベントメソッドとは何ですか?

基本的なイベント メソッド: 1. click()、マウス クリック イベントを設定します; 2. dblclick()、マウス ダブルクリック イベントを設定します; 3. change()、コンテンツ変更イベントを設定します; 4. focus()、トリガーフォーカスイベントを設定; 5.blur()、フォーカス喪失イベントを設定; 6.mousedown()など。

このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。

イベント メソッドは、選択した要素のイベント ハンドラーをトリガーするか、関数を追加します。

次の表に、イベントを処理するためのいくつかの jQuery メソッドを示します。

#メソッド説明bind()イベント ハンドラーを要素 blur()ロスト フォーカス イベントの追加/トリガーchange()Add / 変更イベントのトリガーclick()クリック イベントの追加/トリガーdblclick() ダブルクリック イベントの追加/トリガー die()focus()フォーカス イベントを追加/トリガーします#focusin()focusout()hover()keydown()#keypress()キープレス イベントの追加/トリガーキーアップの追加/トリガーイベント バージョン 1.9 では削除されました。 mousedown イベントを追加/トリガーします#mouseenter()mouseenter イベントの追加/トリガーmouseleave()mouseleave イベントの追加/トリガーmousemove()mousemove イベントを追加/トリガーmouseout()mouseout イベントを追加/トリガーmouseover()マウスオーバー イベントの追加/トリガーmouseup()マウスアップ イベントの追加/トリガーoff()on() メソッドを通じて追加されたイベント ハンドラーを削除しますon()要素にイベント ハンドラーを追加one()選択した要素に 1 つ以上のイベント ハンドラーを追加します。このハンドラーは要素ごとに 1 回だけトリガーできますバージョン 1.9 で削除されました。 クリック イベントを切り替えるための 2 つ以上の関数を追加します

はバージョン 1.9 で削除されました。 live() メソッドを通じて追加されたすべてのイベント ハンドラーを削除します

イベント ハンドラーを focusin イベントに追加します

イベント ハンドラーを focusout イベントに追加します

ホバー イベントに 2 つのイベント ハンドラーを追加します

Add /Trigger keydown イベント

##keyup()

live()

現在または将来選択される要素に 1 つ以上のイベント ハンドラーを追加します

mousedown()

#ready()

DOM が完全にロードされたときに実行される関数を指定します

toggle()

trigger()選択した要素にバインドされたすべてのイベントをトリガーします

triggerHandler()

選択した要素の指定されたイベントにバインドされたすべての関数をトリガーします

unbind()

追加されたイベントを削除します選択した要素からのハンドラー

#undelegate()

現在または将来の選択した要素プログラムからイベント ハンドラーを削除します

説明:

1. 上記のイベント関数には 3 つの用途があります:

//直接绑定事件到元素上
$('.target1').keydown(function(e) {
    $("em:first").text(e.target.value)    //通过对象e获取输入的值
});
 
//传递参数调用函数处理
$("#test").click(11111,function(e) {
    //this指向 div元素
    //e.data  => 11111 通过e传递参数数据
});
 
//手动触发已绑定的点击事件
$elem.click()

2. マウスオーバーとマウスエンターの違い: マウス ポインターが通過するかどうかは関係ありません。選択した要素または他の子要素を介してマウスオーバー イベントがトリガーされます。これはサポート バブル処理 と呼ばれます。バブル処理とは、子要素と親要素によって共同で定義されたイベントを指します。子要素がトリガーされるとき、または子要素が定義されていない場合、イベントは親に伝播され、親イベントがトリガーされます。 Mouseenter イベントは、マウス ポインターが選択された要素の上を通過したときにのみ発生します。

3. form 要素には、フォームを送信するというデフォルトの動作があります。送信によって処理される場合は、ブラウザのこのデフォルトの動作を無効にする必要があります。従来の方法では、イベント オブジェクト e.preventDefault() を呼び出して処理しますが、jQuery では、関数の最後に直接 false を返すことができます。

    //回车键或者点击提交表单后禁止浏览器默认跳转：
    $('#target2').submit(function() {
        alert('捕获提交表达动作,阻止页面跳转')
        return false;
    });

4. on() を使用します

基本的な使用法: .on(events,[selector],[data])

クリックをバインドする最も一般的な方法要素 Event で、ショートカットとメソッドの違いを比較します。

$("#elem").click(function(){})  //快捷方式
$("#elem").on('click',function(){}) //on方式

//多个事件绑定同一个函数，通过空格分离，传递不同的事件名，可以同时绑定多个事件
$("#elem").on("mouseover mouseout",function(){ });

//多个事件绑定不同函数
$("#elem").on({
    mouseover:function(){}, 
    mouseout:function(){}
});

//将数据传递到处理程序
$( "button" ).on( "click", {    //第二个参数传递数据给函数调用
  name: "Mr.Tory"
}, greet );
function greet( event ) {
  alert( "Hello " + event.data.name ); //输出Hello Mr.Tory
}

イベント オブジェクトのプロパティとメソッド

.dataイベントの呼び出し時に追加のパラメーターが渡されます.targetイベントをトリガーした DOM 要素##.that.timeStampイベントを防ぐデフォルトのアクションイベントのバブリングをキャンセルする

$("#content").click(function(event) {
   $("#msg").html("<p>外层div元素被单击</p>");
   event.stopPropagation();                         //通过event方法阻止事件冒泡  
});

Web フロントエンド ビデオ ]

。 type	#イベント タイプ。イベント処理関数を使用して複数のイベントを処理する場合、このプロパティを使用して、click ## などのイベント タイプを取得できます。
#キーまたはボタンが押されたことを示します
このプロパティは、次の時刻を返します。 1970 年 1 月 1 日からイベント発生時まで ミリ秒数	##.pageX/Y
マウスの相対的な位置ドキュメントの左端/上端	.result
前の同じイベント ハンドラー関数によって返された値	#.preventDefalut()
	##.stopPropagation()
	[推奨学習: jQuery ビデオ チュートリアル 、

以上がjqueryの基本的なイベントメソッドとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。