toggle

UK[?t?gl] US[?tɑ:gl]

n.スティック ボタン; 投げ縄ボタン; 変換キー; 切り替えキー

v.スイッチ

jquery toggle()方法 構(gòu)文

関數(shù):toggle() メソッドは、2 つ以上のイベント ハンドラー関數(shù)をバインドして、選択した要素のクリック イベントに順番に応答するために使用されます。このメソッドは、選択した要素の Hide() メソッドと show() メソッドを切り替えるために使用することもできます。

2 つ以上の関數(shù)をトグル イベントにバインドします: 指定された要素をクリックすると、2 つ以上の関數(shù)を順番に切り替えます。 3 つ以上の関數(shù)が指定されている場合、toggle() メソッドはすべての関數(shù)を切り替えます。たとえば、3 つの関數(shù)がある場合、最初のクリックで最初の関數(shù)が呼び出され、2 回目のクリックで 2 番目の関數(shù)が呼び出され、3 回目のクリックで 3 番目の関數(shù)が呼び出されます。 4 回目のクリックで最初の関數(shù)が再度呼び出され、以下同様に続きます。

構(gòu)文: $(selector).toggle(function1(),function2(),functionN(),...)

パラメータ:

パラメータ 説明
function1() 必須。要素が偶數(shù)回クリックされたときに実行する関數(shù)を指定します。
function2() 必須。要素が奇數(shù)回クリックされるたびに実行される関數(shù)を指定します。
functionN(),... オプション。切り替える必要があるその他の機(jī)能を指定します。


Hide() と Show():
各要素が表示されるかどうかを確認(rèn)します。要素が非表示の場合は、show() を?qū)g行します。要素が表示される場合、要素は Hide() になります。これによりスイッチング効果が生まれます。

#構(gòu)文: $(selector).toggle(speed,callback)

パラメータ:

パラメータ説明
speed オプション。非表示/表示効果の速度を指定します。デフォルトは「0」です??赡埭蕚? ミリ秒 (例: 1500) 「遅い」 「通常」 「速い」
callbackオプション。 toggle() メソッドの完了時(shí)に実行される関數(shù)。


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

##構(gòu)文: $(selector).toggle(switch)

##パラメータ:

#パラメータ説明スイッチ 必須。 toggle() が選択されたすべての要素のみを表示するか非表示にするかを指定するブール値。 true - 要素を表示 false - 要素を非表示#

jquery toggle()方法 例

<html>
<head>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").toggle(function(){
    $("body").css("background-color","green");},
    function(){
    $("body").css("background-color","red");},
    function(){
    $("body").css("background-color","yellow");}
  );
});
</script>
</head>
<body>
<button>請點(diǎn)擊這里,來切換不同的背景顏色</button>
</body>
</html>
インスタンスの実行 ?

[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します