Jquery控制ul标签组的class切换
jquery控制class
问题:控制ul标签组点击单选,需要切换对应样式。样式和htlm如下

<div class="drag-settings-item">
<div class="item-hd">对齐方式</div>
<div class="item-bd">
<ul class="item-label-box" id="headerAlign">
<li data-value="0">左对齐</li>
<li data-value="1">居中</li>
<li data-value="2" class="on">右对齐</li>
</ul>
</div>
</div>
解决:给li绑定click事件,点击时切换对应class
$(function () {
var ClassChange = function (el, multiple) {
this.el = el || {};
this.multiple = multiple || false;
// Variables privadas
var links = this.el.find("li");
// Evento
links.on('click', {
el: this.el,
multiple: this.multiple
}, this.dropdown)
};
ClassChange.prototype.dropdown = function (e) {
var $el = e.data.el;
$this = $(this);
$next = $this.next();
if($this.attr("class") != "on"){
$this.toggleClass('on');
}
if (!e.data.multiple) {
$el.find('li').not($this).removeClass('on');
}
};
new ClassChange($('#headerAlign'), false);
});

浙公网安备 33010602011771号