3

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

最初我只是将任何已检查的内容添加到一个数组中,但是如果用户决定取消选中它,我在尝试从数组中删除选中的项目时遇到了问题。上面的其他方式似乎是类似的方法。

我在这里创建了一个 Codepen

我的 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 -->
4

1 回答 1

4

试试这个脚本

     $(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并在数组中返回它们的值

于 2013-04-03T19:00:49.933 回答