jQuery iCheck回调

Question

我正在使用Jquery iCheck来设置输入字段的样式，并且我无法真正处理来自iCheck的回调。我想要检索的内容，所有已检查的容器内的输入值是否具有给定的类名

http://jsfiddle.net/lgtsfiddler/E4bKg/1/ 这是我一直在尝试的，但点击的elemnt on flow不会在第二次点击时被推入数组。

  <ul class="brands">
        <li>
            <input class ="marken" type="checkbox" name="brand" value="brand1">
            <label>brand1</label>
        </li>
        <li>
             <input class ="marken" type="checkbox" name="brand" value="brand1">
            <label>brand2</label>
        </li>
        <li>
             <input class ="marken" type="checkbox" name="brand" value="brand1">
            <label>brand3</label>
        </li>
        <li>
             <input class ="marken" type="checkbox" name="brand" value="brand1">
            <label>brand4</label>
        </li>
    </ul>

代码：

 $(document).ready(function () {
     //here I style with iCheck
     $('ul.brands input').each(function () {
         var self = $(this),
             label = self.next(),
             label_text = label.text();

         label.remove();
         self.iCheck({
             checkboxClass: 'icheckbox_line-blue',
             radioClass: 'iradio_line',
             insert: '<div class="icheck_line-icon"></div>' + label_text
         });
     });

     //Register click event
     $('ul.brands input').on('ifClicked', function (event) {
         brands();
     });
 });
 //here I try to retrieve all checked values
 function brands() {
     var brands = [];
     $('ul.brands li div.icheckbox_line-blue').each(function (index, value) {
         var attr_class = $(value).attr('class');
         console.log(attr_class);
         //check if icheckbox_line-blue class contains checked  
         if (attr_class.indexOf("checked") !== -1) {
             brands.push($(value).find('input').val());
         }
     });
     console.log(brands);
 }

所以如何在检查完这个课后检查？

Answer 1

您可以检查原始复选框，并从父级获取按钮说明，而不是检查类。

旁注，我使用ifToggled事件，因此会针对已检查和未检查的元素触发。

代码：

$('ul.brands input').each(function () {
    var self = $(this),
        label = self.next(),
        label_text = label.text();

    label.remove();
    self.iCheck({
        checkboxClass: 'icheckbox_line-blue',
        radioClass: 'iradio_line',
        insert: '<div class="icheck_line-icon"></div>' + label_text
    });
});

$('ul.brands input').on('ifToggled', function (event) {
    brands();
});

function brands() {
    var brands = [];
    $('ul.brands input').each(function (index, value) {
        if ($(this).is(':checked')) {
            brands.push($(this).parent().text());
        }
    });
    console.log(brands);
}

演示：http://jsfiddle.net/IrvinDominin/S2NdY/