Javascript 复选框div双重标签?

Javascript 复选框div双重标签?,javascript,jquery,checkbox,Javascript,Jquery,Checkbox,我不知道为什么当点击复选框时,它会将相关的标签文本加倍。有人能帮我吗 // add multiple select / deselect functionality $("#selectall").click(function () { $('.child').attr('checked', this.checked); $('.ck,.chkbox,.checkAll ,input:

我不知道为什么当点击复选框时,它会将相关的标签文本加倍。有人能帮我吗

// add multiple select / deselect functionality
                $("#selectall").click(function () {
                    $('.child').attr('checked', this.checked);
                    $('.ck,.chkbox,.checkAll ,input:radio').DcustomInput();
                }); 

jQuery.fn.DcustomInput = function(){
                    $(this).each(function(i){   
                        if($(this).is('[type=checkbox],[type=radio]')){
                            var input = $(this);
                            var id=input.attr('id');


                        // get the associated label using the input's id
                        var forlabel = $('label[for='+input.attr('id')+']');
                        var chklabel = forlabel.text();
                        forlabel.hide();
                        var label = $("<label  for='"+id+"' class='checker'>"+chklabel+"</label>");

                        //get type, for classname suffix 
                        var inputType = (input.is('[type=checkbox]')) ? 'checkbox' : 'radio';   
                        //  alert(label);
                        // wrap the input + label in a div 
                        $('<div class="custom-'+ inputType +'"></div>').insertBefore(input).append(input, label);

                        // find all inputs in this set using the shared name attribute

                        if(input.is(':disabled')){
                            if(inputType == 'checkbox' && input.is(':checked')){ 
                                label.addClass(' checkedDisabled '); 
                            } else{
                                label.addClass(' disabled ');   
                            }
                        }

                        // necessary for browsers that don't support the :hover pseudo class on labels
                        label.hover(
                        function(){ 
                            if(!input.is(':disabled') ){
                                $(this).addClass('hover');
                            }
                            if(inputType == 'checkbox' && input.is(':checked') && !input.is(':disabled')){ 
                                $(this).addClass('checkedHover'); 
                            } 
                        },
                        function(){ $(this).removeClass('hover checkedHover focus'); }
                    );

                        //bind custom event, trigger it, bind click,focus,blur events                   
                        input.bind('updateState', function(){   
                            if (input.is(':checked') && !input.is(':disabled')) {
                                if (input.is(':radio')) {   
                                    var allInputs = $('input[name='+input.attr('name')+']');
                                    allInputs.each(function(){
                                        $('label[for='+$(this).attr('id')+']').removeClass('checked');
                                    });     
                                };
                                label.addClass('checked ');
                            }
                            else { label.removeClass('checked checkedHover checkedFocus '); }

                        })
                        .trigger('updateState')
                        .click(function(){ 
                            $(this).trigger('updateState'); 
                        })
                        .focus(function(){ 
                            label.addClass('focus'); 
                            if(inputType == 'checkbox' && input.is(':checked')){ 
                                $(this).addClass('checkedFocus'); 
                            } 
                        })
                        .blur(function(){ label.removeClass('focus checkedFocus'); });
                    }
                });
            };
        </script>
//添加多个选择/取消选择功能
$(“#选择全部”)。单击(函数(){
$('.child').attr('checked',this.checked);
$('.ck、.chkbox、.checkAll,输入:radio').DcustomInput();
}); 
jQuery.fn.DcustomInput=函数(){
$(此).each(函数(i){
if($(this).is('[type=checkbox],[type=radio]')){
var输入=$(此);
var id=input.attr('id');
//使用输入的id获取关联的标签
var-forlabel=$('label[for='+input.attr('id')+']');
var chklabel=forlabel.text();
forlabel.hide();
变量标签=$(“”+chklabel+“”);
//获取类名称后缀的类型
var inputType=(input.is('[type=checkbox]')?'checkbox':'radio';
//警报(标签);
//将输入+标签包装在一个div中
$(“”).insertBefore(输入).append(输入,标签);
//使用“共享名称”属性查找此集合中的所有输入
if(input.is(':disabled')){
如果(inputType='checkbox'&&input.is(':checked')){
label.addClass('checkedDisabled');
}否则{
label.addClass('disabled');
}
}
//对于不支持标签上的:hover伪类的浏览器是必需的
标签悬停(
函数(){
如果(!input.is(':disabled')){
$(this.addClass('hover');
}
如果(inputType='checkbox'&&input.is(':checked')&&&input.is(':disabled')){
$(this.addClass('checkedHover');
} 
},
函数(){$(this).removeClass('hover checkedHover focus');}
);
//绑定自定义事件、触发它、绑定单击、聚焦、模糊事件
bind('updateState',function(){
if(input.is(':checked')&&!input.is(':disabled')){
if(input.is(':radio'){
var allInputs=$('input[name='+input.attr('name')+']);
allInputs.each(函数(){
$('label[for='+$(this.attr('id')+']')).removeClass('checked');
});     
};
label.addClass('checked');
}
else{label.removeClass('checked checked hover checked focus');}
})
.trigger('updateState'))
。单击(函数(){
$(this.trigger('updateState');
})
.focus(函数(){
label.addClass('focus');
如果(inputType='checkbox'&&input.is(':checked')){
$(this.addClass('checkedFocus');
} 
})
.blur(函数(){label.removeClass('focus checkedFocus');});
}
});
};

我不太清楚DcustomInput的功能,但我可以猜到,
$('.ck、.chkbox、.checkAll,input:radio').DcustomInput()需要放在document ready上,而不是click handler上。好的,我找到了解决方案,只需注释这两行:

forlabel.hide();
$('<div class="custom-'+ inputType +'"></div>').insertBefore(input).append(input, label);
forlabel.hide();
$(“”).insertBefore(输入).append(输入,标签);

这样就不会隐藏旧标签,我们也不会试图复制输入和旧标签

你能添加HTML来配合它吗?你能指出一段代码中标签可能被修改的地方吗?我有一个名为“selectall”的复选框来检查“child”类的所有其他复选框。但是我的模板附带了一个额外的jquery,如是。customInput()已放入文档准备就绪。我尝试复制到DcustomInput()来修改它,这样它就不会使label@silentbang对不起,我不明白你的意思。您是否已经将我在文档上注释的代码放置就绪并从click handler中删除了它?