jQueryにおけるtoggleClassメソッドによるクラスの厳格な削除と追加
toggleClassには、
true や false のような状態パラメータを渡すこともでき、
その場合、クラスは追加のみ、または削除のみが行われます。
以下のCSSクラスがあるとします：
.red {
color: red;
}
.zzz {
font-style: italic;
}
段落にクラス zzz が適用されています：
<p class="zzz" id="test">text</p>
<button>click</button>
クリック時にのみクラス red を追加するようにしましょう：
$('button').click(function() {
$('#test').toggleClass('red', true);
});
ご覧の通り、再度クリックしても何も変化は起こりません。
クラス操作に使用されるこれら3つのメソッド -
addClass,
removeClass,
toggleClass
は、パラメータとして複数のクラスを受け取ることも、
セット内の各要素に関数を適用することも可能です。
上記のコード例を修正してください - まず属性に
クラス red を追加記述し、その後、
クラス red が削除のみ行われるようにしてください。
