【JS】ボタンをクリックするたびにクラスを付与したり消したりする
これだけ。
フラグ立てる必要もないので便利。
1.Toggleの場合
(function($) {
$(function() {
var $header = $('#top-head');
// Toggle Button
$('#nav-toggle').click(function(){
$header.toggleClass('open');
});
});
})(jQuery);
2.click each
$("span").click(function () {
$("li").each(function(){
$(this).toggleClass("example");
});
});
html
<html>
<head>
<script src="/jquery/js/jquery.js"></script>
<script>
window.onload = (function(){try{
$("span").click(function () {
$("li").each(function(){
$(this).toggleClass("example");
});
});
}catch(e){}});</script>
<style>
ul { font-size:18px; margin:0; }
span { color:blue; text-decoration:underline; cursor:pointer; }
.example { font-style:italic; }
</style>
<style>html,body{border:0; margin:0; padding:0;}</style></head>
<body>
To do list: <span>(click here to change)</span>
<ul>
<li>Eat</li>
<li>Sleep</li>
<li>Be merry</li>
</ul>
</body>
</html>