您的位置:首页 > Web前端 > JQuery

JQuery全选/反选设置

2016-05-23 17:02 337 查看
/**
* HTML代码
*/
<div class="checkbox-filter">
<label class="select"><span>近一年</span></label>
<label class="cut"></label>
<label val="1Min" class="cb"><span class="list-item"> </span>1Min</label>
<label val="5Min" class="cb"><span class="list-item"> </span>5Min</label>
<label val="15Min" class="cb"><span class="list-item"> </span>15Min</label>
<label val="30Min" class="cb"><span class="list-item"> </span>30Min</label>
<label val="1h" class="cb"><span class="list-item"> </span>1h</label>
<label val="2h" class="cb"><span class="list-item"> </span>2h</label>
<label val="4h" class="cb"><span class="list-item"> </span>4h</label>
<label val="1d" class="cb"><span class="list-item"> </span>1d</label>
<label val="1w" class="cb"><span class="list-item"> </span>1w</label>
<label val="all" class="all"><span class="list-item"> </span>全部</label>
</div>

/**
* jQuery代码
*/

$(function(){
$("div label:gt(1)").on("click", function () {
if($(this).hasClass("all")){
if($(this).hasClass("on")){
$("div label:gt(1)").removeClass("on");
$(this).removeClass("on");
}else{
$("div label:gt(1)").addClass("on");
$(this).addClass("on");
}
}else{
if($(this).hasClass("on")){
$(this).removeClass("on");
$("div label.all").removeClass("on");
}else{
$(this).addClass("on");
var $flag = true;
$.each($("label.cb"),function (k,b) {
if(!$(b).hasClass("on")){
$flag = false;
return false;
}
})
if($flag){$("div label.all").addClass("on");}
}
}
})
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  全选