Question

所以我有一个带有div的模块弹出窗口。在它有几个复选框，我想要做的是在用户完成检查或取消选中他想要的方框并点击完成按钮之后。我希望jQuery将所有选定的值转储到arrray中。

最初我刚刚将所检查的内容添加到数组中，但是如果用户决定取消选中，那么我在尝试从数组中删除已检查项时遇到问题。以上面的其他方式执行此操作似乎是类似的方法。

我创建了一个Codepen here。

我的jQuery

$('.select-roles').click(function(){
    var selectedRole = $(this).html();

    var selectedArray = new Array();

    $('roleId input:checked').each(function() {
        selectedArray.push($(this).val());
        console.log($(this).val());
    });

    console.log('modalName = '+modalName);
    console.log('selected array contains: '+selectedArray);
});

// displays the value of the checked checkbox in the console
$('input[type=checkbox]').click(function() {

    if($(this).is(':checked')){
        console.log( $(this).val())
    }
});

HTML

<div id="modal-TV">

        <div class="modal-top">
            <div class="modal-title">Actor: Select one or more genres below</div>

        </div>

        <div class="modal-choices">
            <div class="modal-col-1">
                <ul>
                    <li><input type="checkbox" value="Adult Animated">Adult Animated</li>
                    <li><input type="checkbox" value="Anime">Anime</li>
                    <li><input type="checkbox" value="Award Shows">Award Shows</li>
                    <li><input type="checkbox" value="Behind The Scenes">Behind The Scenes</li>
                    <li><input type="checkbox" value="Christian">Christian</li>
                </ul>
            </div>

            <!-- modal-choices -->

        <div class="modal-dashes"></div>
        <div class="modal-buttons">
            <ul>
                <a class="close" title="Cancel"><li>Cancel</li></a>
                <li class="select-roles">Done</li>
            </ul>
        </div>
    </div>
    <!-- modal-TV -->

Answer 1

试试这个脚本

     $(function () {
        function dumpInArray(){
           var arr = [];
           $('.modal-choices input[type="checkbox"]:checked').each(function(){
              arr.push($(this).val());
           });
           return arr; 
        }

        $('.select-roles').click(function () {
           dumpInArray();
        });
     });

单击“完成”后，选择.select-roles中所有选中的复选框并在数组中返回其值

如何在jQuery中将复选框的值收集到Array中

1 个答案: