方法有二:
//初始化div，并注册事件
var initDiv = function () {
$(".managementPanel div").eq(0).css("background", "red");
$(".managementPanel div").mouseover(function () {
$(this).css("background", "#588600");
}).mouseout(function () {
$(this).css("background", "");
})
};
initDiv();
$(".managementPanel div").click(function () {
$(this).prev().css("background","");
initDiv();
//当前被点击的div改变背景色
$(this).css("background", "red");
//取消当前div的mouseout和mouseover事件
$(this).unbind("mouseout");
$(this).unbind("mouseover");
});
代码很多吧 ,很麻烦
方法二:
.active{
background: #54a7f0;
color:#fff;
border-radius: 3px;
}
//html代码
<ul class="money-ul">
<li class="active">不限</li>
<li>3-6月</li>
<li>6-12月</li>
<li>12-18月</li>
<li>18月以上</li>
</ul>
加一个样式
$(".money-ul li").on("click",function(){
$(this).addClass("active").siblings().removeClass("active");
})
三行代码就搞定了对不对,有没有很兴奋!!!
用zepto的时候,把click换成tap就OK了.但是呢,记得link zepto.js的文件啊,没有链接,白费劲了.
