icheck插件的jquery更改属性 [英] jquery change attribute of icheck plugin

问题描述

我有这段代码可以使用iCheck插件(用于jquery)来设置复选框的样式，以后是否可以更改'insert'属性?我尝试重新创建iCheck，但如果那样做，则会删除回调函数.

I have this code to style a checkbox using the iCheck plugin for jquery, is there a way to change the 'insert' attribute later?. I tried recreating the iCheck but the callback function is deleted if I do it that way.

$(this).iCheck({
    checkboxClass: checkboxClass,
    insert: '<div class="icheck_line-icon"></div>' + $(this).attr("data-label")
});

$(this).on({ifChecked: function(){
    iCheckChange(this, yes);
},ifUnchecked: function(){
    iCheckChange(this, no);
}
});

推荐答案

假设您具有以下格式的复选框:

Lets say you have checkboxes in this format:

<input type="checkbox" class="my_checkbox" data-label="Check me" />

比您可以通过以下方式更改图标和文本:

Than you can change your icon and text this way:

var checkboxClass = 'checkbox_cls';
$('.my_checkbox').each(function(i) {
    var thisCheckbox=$(this);
    thisCheckbox.iCheck({
        checkboxClass: checkboxClass,
        insert: '<div class="icheck_line-icon"></div><span class="insert_label">' + thisCheckbox.data("label") + '</span>'
    });
    var thisIcon = thisCheckbox.siblings('.icheck_line-icon');
    var thisLabel = thisCheckbox.siblings('.insert_label');
    thisCheckbox.on('ifChecked', function(e){
        thisIcon.addClass('icon-checked');
        thisLabel.html('Im checked');
    });
    thisCheckbox.on('ifUnchecked', function(e){
        thisIcon.removeClass('icon-checked');
        thisLabel.html('Not checked');
    });
});

看看 此小提琴 .

Take a look at this Fiddle.

这篇关于icheck插件的jquery更改属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！