8

我使用出色的iCheck插件在我的表单中设置复选框的样式。

使用该插件，我只需调用$('input').iCheck()即可应用所需的外观和功能。

但是，我坚持在.iCheck()动态创建的复选框上调用该函数。

在 ajax 调用中，我在成功函数中构建我的复选框，如下所示；这是在一个$.each块中，但为了简单起见，我只在语句中包含了代码。

var chk = $('<div><input id="' + n.ID + '" type="checkbox" name="lblChk"><label for="' + n.ID + '">' + n.Title + '</label></div>');
el.append(chk);

DOM 树中已经存在elid 的 div在哪里，我的对象是否以 JSON 形式返回containern

在构建复选框之后，我$('#container input').iCheck();显然打电话给我，除了标准复选框之外我没有什么特别的。我认为这是因为复选框是在.iCheck()调用之后动态创建的。但即使在我创建复选框并调用.iCheck()结果之后也是一样的。

有人可以指导我吗？

4

6 回答 6

13

尝试这个

$('#container').iCheck({checkboxClass: 'icheckbox_flat-green',radioClass: 'iradio_flat-green'});
于 2013-09-02T14:22:45.510 回答
7

还有另一种情况......当iCheck有回调时

此代码不适用于加载 ajax 的输入，因为它是 bind() 的替代品：

$('#mycheckbox').on('ifChecked', function(event) {
    alert();
});

应改为使用委托事件：

$(document).on('ifChecked', '#mycheckbox', function(event) {
 alert('done'); 
});
于 2015-12-17T08:44:28.377 回答
5

尝试这个...

$('#container').find('input').iCheck();

你试过检查长度$('#container input')吗？我不确定，但 input 不是containerselector 的直接子代，因此可能无法找到$('#container input')。

于 2013-04-24T17:17:14.600 回答
3

好吧，我前段时间遇到了类似的问题，并像这样解决了它：

假设该el变量是一个 jQuery 元素，我会将插件 iCheck 的初始化绑定到el完全加载，因此：

此代码应放在 AJAX 附加数据之后

el.ready(function() {
  $('#container input').iCheck({
    checkboxClass: 'icheckbox_flat-green',
    radioClass: 'iradio_flat-green' // If you are not using radio don't need this one.
  });
});

请记住使代码适应您的 HTML 结构的特殊性。在将元素附加到页面后运行上面的代码，您正在初始化这些新添加元素的 iCheck，但是如果您使用 iCheck 回调，则该插件只有在您正确声明这些回调时才能工作，将事件委托给正如弗洛林警告的那样，适当的标签。

这段代码应该放在iCheck第一次初始化

$(document).on('ifChecked', '#mycheckbox', function() {
  $(this).addClass('selected');
});

$(document).on('ifUnchecked', '#mycheckbox', function() {
  $(this).removeClass('selected');
});
于 2017-01-03T21:51:22.160 回答
1

尝试这个：

$('input').iCheck({
     checkboxClass: 'icheckbox_flat-blue',
     radioClass: 'iradio_flat-blue'
});

如果你想从特定的 div 设置试试这个：

$('#MyDivId input').iCheck({
      checkboxClass: 'icheckbox_flat-blue',
      radioClass: 'iradio_flat-blue'
});

检查http://icheck.fronteed.com/上的文档

于 2017-07-17T23:18:42.170 回答
-2

我刚遇到同样的问题，解决方法很简单：调用iCheck方法。

var id = some_id;
var one_row = "<tr><td>...<td><td><input type=\"radio\" class=\"minimal\" id=\"" + id + "\" name=\"" + id + "\">radio1</td></tr>";
// add this row to HTML
// call the initialize method
$('#'+id).iCheck({radioClass: 'iradio_minimal-blue'});
于 2017-07-05T03:12:19.477 回答