ホームページ  >  記事  >  ウェブフロントエンド  >  js切り替えエフェクト例でのトグル機能の使い方

js切り替えエフェクト例でのトグル機能の使い方

藏色散人
藏色散人オリジナル
2018-08-15 16:38:2416322ブラウズ

この記事ではjQuery関数のトグルクリックイベント切り替えの操作方法を中心に紹介します。まず最初に、toggle() メソッドの定義を理解する必要があります。 toggle() メソッドは要素の表示状態を切り替えます。選択した要素が表示されている場合は非表示にし、選択した要素が非表示になっている場合は表示します。

次の具体的なコード例:

toggle(fn,fn)

toggle() は、クリックされるたびに呼び出される関数を切り替えます。 一致する要素をクリックすると、指定された最初の関数がトリガーされ、同じ要素が再度クリックされると、指定された 2 番目の関数がトリガーされます。後続のクリックごとに、これら 2 つの関数の呼び出しが順番に繰り返されます。

注: unbind("click") を使用して削除できます。
戻り値 jQuery
パラメータ fn(関数): 奇数クリック時に実行される関数。 fn (関数): 偶数クリック時に実行される関数。

jQuery コード (テーブルを切り替えるためのクラス):

$("td").toggle( 
function () { 
$(this).addClass("selected"); 
}, 
function () { 
$(this).removeClass("selected"); 
} 
);
$('#btntrack').toggle(
 function(){
 $(this).text('继续跟踪');
 $(this).addClass('active');
 },
 function(){
 $(this).text('暂停跟踪')
 $(this).removeClass('active');
 }
)

ここで注意してください: toggle はクリックされた場合にのみ役立ち、hover はマウスが出入りするための単なるイベントであり、クリックとは何の関係もありません。両方を一緒に使用できます。

ということで、この記事はクリック切り替えを実現するためのtoggleの紹介であり、jsのtoggle関数の使い方をある程度理解していただければ幸いです。

以上がjs切り替えエフェクト例でのトグル機能の使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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