jqueryの一般的なバインディングイベントは何ですか?

jQuery には、一般的に使用される 4 つのバインディング イベントがあります。1. 「on()」メソッド。選択した要素およびサブ要素に 1 つ以上のイベント ハンドラーを追加します。2. 「bind()」 ” メソッド、特定のイベント タイプのリスニング関数を選択した要素にバインドします。 3. “live()” メソッド、バージョン 1.9 で削除されました。 4. “delegate()” メソッド、1 つまたは複数のイベント ハンドラーを追加して実行します。指定された関数。

このチュートリアルのオペレーティング システム: Windows 10 システム、jQuery3.6.0 バージョン、Dell G3 コンピューター。

jquery には一般的に使用されるバインディング イベントが 4 つあります:

1. on() メソッド (推奨メソッド)

on () メソッドは、選択した要素とサブ要素に 1 つ以上のイベント ハンドラーを追加します。

jQuery バージョン 1.7 以降、on() メソッドは、bind()、live()、および delegate() メソッドに代わる新しいメソッドです。このメソッドは API に多くの利便性をもたらし、jQuery コード ベースを簡素化するため推奨されます。

パラメータ:

event: 必須。選択した要素から削除する 1 つ以上のイベントまたは名前空間を指定します。スペースで区切られた複数のイベント値。有効なイベントである必要があります

data: オプション。イベント ハンドラーを指定した子要素にのみ追加できるように指定します (非推奨の delegate() メソッドなどのセレクター自体には追加できません)。

関数: オプション。イベントの発生時に実行する関数を指定します。

map: 要素に追加する 1 つ以上のイベントを含むイベント マッピング ({event:function,event:function, ...}) を指定します。 、イベントの発生時に実行する関数。

構文: $(

selector).on(event,childSelector,data,function,map)

例: 単一の要素をp 要素をクリックします。event

$("p").on("click",function(){

    alert("The paragraph was clicked.");

});

2 をクリックします。bind() メソッド

bind() 関数は、特定のイベント タイプを選択したイベント タイプにバインドします。要素リスニング関数、

パラメータ:

type:必須。イベント タイプ (クリック、変更、マウスオーバーなど);

data:オプション。リスニング関数に渡されるパラメータは、event.data を通じて取得されます。オプション;

関数:必須。イベント発生時に実行する関数(リスニング関数)を指定し、イベントオブジェクトを渡すことができます。ここでのイベントはjQueryでカプセル化されたイベントオブジェクトであり、ネイティブのイベントオブジェクトとは異なります。それを使って。

map:追加する要素を含むイベント マッピング ({event:function,event:function, ...}) を指定します。 to 1 つ以上のイベント、およびイベント発生時に実行する関数

構文: $(

selector).bind(event,data,function,map)

例:

$("p").bind("click",function(){

    alert("单击p元素");

});

3.live() メソッド

live () にクリック イベントを追加します。 ,

はバージョン 1.9 で削除されました。 代わりに on() メソッドを使用してください。現在または将来の選択された要素に 1 つ以上のイベント ハンドラーを追加します。 (まだここに要約されています)

パラメータ:

event: required 。要素に追加する 1 つ以上のイベントを指定します。スペースで区切られた複数のイベント値。有効なイベントである必要があります。

データ:オプション。関数

関数:必須に追加のパラメータが渡されました。イベントが発生すると、関数

が実行されます。構文: $(selector).live(event,data,function)

例: ボタンがクリックされたときに、

要素を非表示または表示します:

$("button").live("click",function(){

    $("p").slideToggle();

});

四、delegate()方法

delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。

参数：

childSelector：必需。规定要添加事件处理程序的一个或多个子元素。

event：必需。规定添加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。

data:可选。传递到该函数的额外参数

function:必需。当事件发生时，运行的函数

语法：$(selector).delegate(childSelector,event,data,function)

举例：当单击

元素内部的

元素时，改变所有

元素的背景颜色：

$("div").delegate("p","click",function(){

    $("p").css("background-color","pink");

});

以上がjqueryの一般的なバインディングイベントは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。