非常に実用的な jQuery toggle() メソッド

例

異なる背景色の切り替え:

$("p").toggle(
  function(){
  $("body").css("background-color","green");},
  function(){
  $("body").css("background-color","red");},
  function(){
  $("body").css("background-color","yellow");}
);

定義と使用法

toggle() メソッドは、2 つ以上のイベント ハンドラー関数 をバインドして、選択した要素のクリック イベントに順番に応答するために使用されます。

このメソッドは、選択した要素の Hide() メソッドと show() メソッドを切り替えるために使用することもできます。

Toggle イベントに 2 つ以上の関数をバインドします

指定された要素がクリックされると、2 つ以上の関数を順番に切り替えます。

3 つ以上の関数が指定された場合、toggle() メソッドはすべての関数を切り替えます。たとえば、関数が 3 つある場合、最初のクリックで最初の関数が呼び出され、2 回目のクリックで 2 番目の関数が呼び出され、3 回目のクリックで 3 番目の関数が呼び出されます。 4 回目のクリックで最初の関数が再度呼び出され、以下同様に続きます。

構文

$(selector).toggle(function1(),function2(),functionN(),...)

自分で試してみる

パラメータ説明必須。要素が偶数回クリックされたときに実行される関数を指定します。 必須。要素が奇数回クリックされるたびに実行される関数を指定します。 オプション。切り替える必要があるその他の機能を指定します。

function1()
function2()
functionN(),...

Hide()とShow()を切り替えます

各要素が表示されているかどうかを確認します。

要素が非表示の場合は show() を実行します。要素が表示される場合、要素は Hide() になります。これによりスイッチング効果が生まれます。

構文

$(selector).toggle(speed,callback)

自分で試してみる

パラメータ説明速度コールバック

	オプション。非表示/表示効果の速度を指定します。デフォルトは「0」です。 可能な値: ミリ秒 (例: 1500) 「遅い」 「普通」 「速い」
	オプション。 toggle() メソッドの完了時に実行される関数。 コールバックの詳細については、コールバック関数のチュートリアルをご覧ください。

要素の表示または非表示

一致するすべての要素のみを表示するか非表示にするかを指定します。

構文

$(selector).toggle(switch)

自分で試してみる

パラメータ説明

switch	必須。 toggle() が選択されたすべての要素のみを表示するか非表示にするかを指定するブール値。 tru​​e - 要素を表示します false - 要素を非表示ます

以上が非常に実用的な jQuery toggle() メソッドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。