javascript - 在复选框上单击将值存储到数组中

Question

我有一个如下所示的复选框列表:

$('.check-user').click(function() {
    var $this = $(this);
    var user_id = $this.attr('value');
    var brandContainer = $this.closest('.pop-state').siblings('.pop-brands');
    brandContainer.html('<p style="margin: 10px !important;">Processing... </p>');
    $.post('/user/usersBrands', { userId: user_id } , function(data) {

        var brands = JSON.parse(data);
        var container = $('<div class="pop-mission-co" />');

        brands.forEach(function (brand, index) {
            var isRegisteredToBrand = null;
            if(brand.userId==null)
            {
                isRegisteredToBrand = false;
             }
            else{
                isRegisteredToBrand = true;
            }
            container.append(buildBrand(brand.id, brand.name, isRegisteredToBrand, index));
        });
        function buildBrand(id, name, isActive, index) {
            var isChecked = isActive ? 'checked="checked"' : ' ';
            return $(
                '<div class="pop-mission-to">' +
                    '<label>' +
                        '<input class="check-brand"' +
                            isChecked +
                            'type="checkbox"' +
                            'name=""' +
                            'value="' + id + '"' +
                            'data-id="' + index + '">'
                                + name +
                    '</label>' +
                '</div>'
            );
        }
        brandContainer
            .children('p').remove();
        brandContainer
            .html(container)
            .find('.pop-mission-co').show();
    });
    brandContainer.on('change', '.check-brand', function() {

        console.log($(this).attr("checked"));

    });
});

复选框列表是在 jQuery 中的 $.post 之后创建的，现在我需要在选中每个复选框时处理该事件，如下所示:

 brandContainer.on('change', '.check-brand', function() {

            console.clear();
    var checked = "";
    if($(this).attr("checked"))
    {
        checked = "checked";
    }
    else
    {
        checked = "unchecked";
    }
    console.log(checked);
    console.log($(this).val());

        });

如您所见，我正在使用委托(delegate)事件处理程序来检查该复选框是否已被选中...当用户单击 1 个复选框时，我应该将其放入数组中，如下所示:

Array { "checked", "1" }

当用户单击另一个复选框时，数组应如下更新:

Array {  "checked", "1", "checked", "2" }

如果用户取消选中他已经选中的复选框，假设第二个复选框的值为 2，则数组应如下所示:

数组 { "选中", "1", "未选中", "2"}

该过程仍在继续...有人可以帮我解决这个问题吗？多谢 ! :)

Answer 1

我认为这可能有效。

var checkbox_events = [];
brandContainer.on('change', '.check-brand', function() {
    if($(this).is(':checked') {
        checkbox_events[$(this).val()] = 'checked';
    } else {
        checkbox_events[$(this).val()] = 'unchecked';
    }
});