javascript - 获取所有选中复选框的值并将它们放在隐藏字段中

Question

如何修改这个简单的检查所有代码以在检查复选框后获取复选框的所有值，然后将它们放入隐藏输入中，每个值应该用逗号分隔，这样我就可以在 php.ini 中分解这些值。复选框位于表格行内

//checks all and unchecks all checkboxes based on checkbox in first row of the table.
 $('th input:checkbox').click(function(e) {
    var table = $(e.target).parents('table:first');
    $('td input:checkbox', table).attr('checked', e.target.checked);

 });

Answer 1

你可以这样做：

$('th input:checkbox').click(function(e) {

   var currentChecked = $('#hiddenInput').val(); 

   if($(this).is(':checked'){
        $('#hiddenInput').val(currentChecked  + ',' + $(this).val());
   }

   //deleting the unchecked checkbox from the list
   else{
       var newValue = currentChecked .replace("," + $(this).val(), "");
   }

});

活生生的例子：http: //jsfiddle.net/mR85S/

Answer 2

这有帮助吗？

$('th input:checkbox').click(function (e) {
    var table = $(e.target).parents('table:first');
    var vals = [];
    $('td input:checkbox', table).each(function(){
        $(this).attr('checked', e.target.checked);
        vals.push($(this).attr('checked') ? $(this).val() : '');
    });
    $('#hidden').val(vals.join());
});

Answer 3

你可以在这篇文章 jQuery 中尝试这样来填充隐藏的输入但保留现有的内容：

function Populate(){
    vals = $('input[type="checkbox"]:checked').map(function() {
        return this.value;
    }).get().join(',');
    console.log(vals);
    $('#tags').val(vals);
}

$('input[type="checkbox"]').on('change', function() {
    Populate()
}).change();

和jsFiddle

Answer 4

我假设您的代码已经可以检查所有这些复选框。基本上，您只想获取您选中的每个复选框的值。

//checks all and unchecks all checkboxes based on checkbox in first row of the table.
 $('th input:checkbox').click(function(e) {
    var table = $(e.target).parents('table:first');
    var checkboxes = $('td input:checkbox', table).attr('checked', e.target.checked);
    var values = '';
    if(e.target.checked) {
       for(var i=0; i<checkboxes.length; i++) {
          values += $(checkboxes[i]).val() + ','; // the val method cant retrieve all the values of a set
       }
       values = values.substr(0, values.length - 1);
    }

    //place values in your hidden input

 });

这应该够了吧。