核心代码就是解绑之前的事件,再重新绑定:
//解帮
self.$wxAdd.off();
self.$wxDel.off();
self.$wxChildAdd.off();
self.$wxChildDel.off();
全代码
var wxList = {
init:function() {
this.build();
this.order();
this.initEvent();
},
build:function () {
//组元素
this.$wxList = $(".wx-list");
this.$wxAll = this.$wxList.find('.wx-element');
this.$wxAdd = this.$wxList.find(".add-wx");
this.$wxDel = this.$wxList.find(".del-wx");
this.$wxOne = $(".add-wx-box .wx-element").clone();
//子元素
this.$wxChildOne = $(".add-wx-child-box .wx-child").clone();
this.$wxChildAdd = this.$wxList.find(".add-wx-child");
this.$wxChildDel = this.$wxList.find(".del-wx-child");
},
initEvent:function () {
var self = this;
//解帮
self.$wxAdd.off();
self.$wxDel.off();
self.$wxChildAdd.off();
self.$wxChildDel.off();
//添加组
self.$wxAdd.on('click', function (e) {
e.stopPropagation();
e.preventDefault();
self.$wxList.append(self.$wxOne);
self.init();
});
//删除组
self.$wxDel.on('click', function (e) {
e.stopPropagation();
e.preventDefault();
$(this).parents('.wx-element').remove();
self.init();
});
//添加子元素
self.$wxChildAdd.on('click', function (e) {
e.stopPropagation();
e.preventDefault();
$(this).parents('.wx-child-box').append(self.$wxChildOne);
self.init();
});
//删除子元素
self.$wxChildDel.on('click', function (e) {
e.stopPropagation();
e.preventDefault();
$cur = $(this).parents('.wx-child');
$other = $cur.siblings();
console.log($cur);
console.log($other);
if ($other.length === 0) {
$cur.find('input:first').val('');
$cur.find('input:last').val('');
} else {
$cur.remove();
}
self.init();
});
},
order:function () {
var self = this;
self.$wxAll && self.$wxAll.each(function(i, e) {
console.log($(e));
$(e).find('input:first').attr('name', 'wechat['+i+'][start_days]');
$(e).find('input').eq(1).attr('name', 'wechat['+i+'][end_days]');
$(e).find('.wx-child').each(function (k, v) {
$(v).find('input:first').attr('name', 'wechat['+i+'][config]['+k+'][mobile]');
$(v).find('input:last' ).attr('name', 'wechat['+i+'][config]['+k+'][qrcode]');
});
});
},
};
wxList.init();