如何将多个复选框值传递到数组中答案

【问题标题】：How to pass multiple checkbox values into an array如何将多个复选框值传递到数组中
【发布时间】：2013-11-11 12:02:50
【问题描述】：

我试图在选中时将复选框列表中的值传递给 jquery 函数，因此我可以使用选定的值。下面的代码不起作用

我希望能够使用复选框功能之外的值

因此，例如，如果我在该函数之外有另一个按钮，它应该能够读取存储在数组中的内容 - 下面的代码由于某种原因不起作用，我们将不胜感激

jquery

 <script>
    $(document).ready(function(){

    var vals = []
    $('input:checkbox[name="check[]"]').each(function() {
        if (this.checked) {
            vals.push(this.value);
        }
    });

     alert(vals[0]);
    });
    </script>

HTML 代码

<form>
<input value="BOOZE" type="checkbox" name="check[]" >PUB, MATES, <br>
<input value="TV"  type="checkbox" name="check[]">BRIBING THE KIDS TO GO BED<br>
<input value="BOOZE" type="checkbox" name="check[]">RAVING TILL THE EARLY HOURS<br>
<input value="PETS"  type="checkbox" name="check[]">PLAYING GRAND THEFT AUTO <br>
<input value="GEEK"  type="checkbox" name="check[]">TWEETING ABOUT SOMETHING <br>
<input value="SPORT"  type="checkbox" name="check[]">GYM<br>
<input value="XMAS"  type="checkbox" name="check[]">SINGING CHRISTMAS SONGS<br>
<input type="checkbox" class="chkNumber" name="check[]">SHARING A DELIGHTFUL BOTTLE 
</form>

【问题讨论】：

你写的每一篇都很好，但是看不懂问题。
您是否希望vals 在您更改复选框的值时发生变化？如果是这样，获取document.ready 的值是不正确的。当你点击按钮时，你应该得到它们。

标签： jquery html checkbox

【解决方案1】：

您需要有一个更改处理程序，您需要在其中过滤选中的复选框元素

 var vals = [];
 $(document).ready(function () {

     var $checkes = $('input:checkbox[name="check[]"]').change(function () {
         vals = $checkes.filter(':checked').map(function () {
             return this.value;
         }).get();

         alert(JSON.stringify(vals));
     });
 });

演示：Fiddle

【讨论】：

这是正确的，但这里的变量 vals 不是全局变量，它的范围是 $('input:checkbox[name="check[]"]').change();函数他不能将这些值用于另一个事件或函数

【解决方案2】：

您可以使用.map() 方法执行此操作，例如：

var vals = $('input:checkbox[name="check[]"]:checked').map(function () {
    return this.value;
}).get();

alert(vals[0]);

Fiddle Demo

【讨论】：

【解决方案3】：

你的代码是正确的，只是把

var vals = [];

外面

$(document).ready();

喜欢

<script>
var vals = [];
$(document).ready(function(){
$('input:checkbox[name="check[]"]').each(function() {
    if (this.checked) {
        vals.push(this.value);
    }
});

 alert(vals[0]);
});
</script>

【讨论】：