单个按钮双击事件
html代码
html代码
<ul class="menua">
<li class="fl lia">
<span class="spb" style="margin-left: 2.2rem;width: 2.2rem;"/>
<label class="labelBox" for="checkBtn">
<i class="checkBtn" id="checkBtn"><input class="checkGree" type="checkbox" name="checkboxs"></i>同意<a
href="javascript:;" class="checkAlink">服务协议</a>
</label>
</span>
</li>
</ul>
css样式代码
item_stree .menua .lia {
width: 100%;
float: left;
margin-bottom: 0.4rem;
}
.item_stree .menua .lia .labelBox {
font-size: 0.24rem;
}
.item_stree .menua .lia .checkBtn {
width: 0.24rem;
height: 0.24rem;
display: block;
float: left;
background: url(../images/weixuan.png) no-repeat;
background-size: 100%;
margin-right: 0.05rem;
margin-top: 0.065rem;
}
.item_stree .menua .lia .checkBtn .checkGree {
opacity: 0;
width: 100%;
height: 100%;
}
.item_stree .menua .lia .checkBtn.lcs_off {
background: url(../images/weixuan.png) no-repeat;
background-size: 100%;
}
.item_stree .menua .lia .checkBtn.lcs_on {
background: url(../images/gouxuan.png) no-repeat;
background-size: 100%;
}
javscript 部分:
$(function(){
var old = null; //用来保存原来的对象
$(".checkBtn").each(function(){//循环绑定事件
if(this.checked){
old = this; //如果当前对象选中,保存该对象
}
this.onclick = function(){
if(this == old){//如果点击的对象原来是选中的,取消选中
$(this).removeClass("lcs_on").addClass("lcs_off");
$("#btnSave").attr("disabled",true).css("background","#dddddd");
this.checked = false;
old = null;
} else{
$(this).removeClass("lcs_off").addClass("lcs_on");
$("#btnSave").attr("disabled",false).css("background","#029421");
old = this;
}
}
});
})