jQuery.off()関数の使い方の詳しい説明

off() 関数は、要素にバインドされた 1 つ以上のイベントの イベント処理 関数を削除するために使用されます。

off() 関数は主に、on() 関数によってバインドされているイベント処理関数のブロックを解除するために使用されます。

この関数はjQueryオブジェクト(インスタンス)に属します。

構文

この関数はjQuery 1.7で追加されました。主に次の 2 つの使用形式があります。

使用方法 1:

jQueryObject.off( [ events [, selector ] [, handler ] ] )

使用方法 2:

jQueryObject.off( eventsMap [, selector ] )

パラメータ

パラメータの説明

events オプション/文字列タイプ スペースで区切られた 1 つ以上のイベント タイプと、オプションの namespace (「click」、「focus click」、「keydown.myPlugin」など)。

eventsMap オブジェクト タイプは Object オブジェクト で、その各属性はイベント タイプとオプションの名前空間 (パラメーター イベント) に対応し、属性値はバインドされたイベント処理関数 (パラメーター ハンドラー) に対応します。

selector オプション/文字列型 どの子孫要素がバインドされたイベントをトリガーできるかを指定するために使用される jQuery セレクター。このパラメーターが null または省略された場合、現在の要素自体がイベントにバインドされていることを意味します (イベント ストリームが現在の要素に到達できる限り、実際のトリガーは子孫要素である場合もあります)。

handler 関数タイプで指定されたオプション/イベント ハンドラー関数。

off() 関数は、現在一致する要素の子孫要素セレクターにバインドされている events イベントのイベント ハンドラーを削除します。

セレクターパラメーターが省略された場合、任意の要素にバインドされているイベントハンドラーが削除されます。

パラメーター セレクターは、on() 関数を通じてバインディングを追加するときに渡されるセレクターと一致している必要があります。

パラメータハンドラが省略された場合、指定された要素の指定されたイベントタイプにバインドされたすべてのイベントハンドラが削除されます。

すべてのパラメーターが省略された場合は、現在の要素の任意の要素にバインドされている任意のイベント タイプのイベント ハンドラーを削除することを意味します。

戻り値

off()関数の戻り値はjQuery型で、現在のjQueryオブジェクトそのものを返します。

実際、off()関数のパラメータはすべてフィルタリング条件であり、すべてのパラメータ条件に一致するイベント処理関数のみが削除されます。パラメータが多いほど、より多くの条件が存在し、削除される範囲は小さくなります。

例と説明

次の初期 HTML コードを参照してください:

927bbba7d2d358ca5106330043afcddd

27290e2a4ad9f6ffb2ecdc103a5fc6baCodePlayer5db79b134e9f6b82c0b36e0489ee08ed

まず、上記のボタンと 3499910bf9dac5ae3c52d5ede7383485 を作成します。要素 イベントをバインドし、off() 関数を使用してイベントのバインドを解除します。対応するコードは次のとおりです。

function btnClick1(){
    alert( this.value + "-1" );
}
function btnClick2(){
    alert( this.value + "-2" );
}
var $body = $("body");
// 为所有button元素的click事件绑定事件处理函数btnClick1
$body.on("click", ":button", btnClick1 );
// 为所有button元素的click事件绑定事件处理函数btnClick2
$body.on("click", ":button", btnClick2 );
//为所有a元素绑定click、mouseover、mouseleave事件
$body.on("click mouseover mouseleave", "a", function(event){
    if( event.type == "click" ){
        alert("点击事件");
    }else if( event.type == "mouseover" ){
        $(this).css("color", "red");
    }else{
        $(this).css("color", "blue");       
    }
});
// 移除body元素为所有button元素的click事件绑定的事件处理函数btnClick2
// 点击按钮，btnClick1照样执行
$body.off("click", ":button", btnClick2);
// 移除body元素为所有button元素的click事件绑定的所有事件处理函数(btnClick1和btnClick2)
// 点击按钮，不会执行任何事件处理函数
// $body.off("click", ":button");
// 注意： $body.off("click", "#btn1"); 无法移除btn1的点击事件，off()函数指定的选择器必须与on()函数传入的选择器一致。
// 移除body元素为所有元素(包括button和<a>元素)的click事件绑定的所有处理函数
// 点击按钮或链接，都不会触发执行任何事件处理函数
// $("body").off("click");
// 移除body元素为所有元素的任何事件绑定的所有处理函数
// 点击按钮，或点击链接或者鼠标移入/移出链接，都不会触发执行任何事件处理函数
// $("body").off( );

さらに、off() 関数は、指定された名前空間のイベント バインドのみを削除することもできます。

りー

以上がjQuery.off()関数の使い方の詳しい説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。