jQuery：将选中复选框存入数组失败，数组为空问题排查

核心错误1：选择器匹配错误 #

你写的选择器 .availability input:checked 逻辑错误——它会查找拥有availability类的父元素内部的选中复选框，但实际上你的复选框本身就带有availability类，这个选择器根本匹配不到任何元素，所以数组始终为空。

正确的选择器应该是 input.availability:checked（或者直接 .availability:checked，因为目标元素都是input）。

核心错误2：数组未重置 #

每次触发复选框的change事件时，你没有清空之前的availability数组，导致重复操作时数组会不断累加旧值（比如勾选再取消后重新勾选，数组会出现重复项）。

修复后的代码 #

基础修复版 #

var availability = [];
$('input[type="checkbox"]').change(function() {
  // 每次触发事件先清空数组
  availability = [];
  // 选择带有availability类的选中复选框
  $('input.availability:checked').each(function() {
    availability.push($(this).attr('name'));
  });
  console.log(availability);
});

简洁优化版（推荐） #

用jQuery的map方法直接生成数组，省去手动清空和循环的步骤：

$('input[type="checkbox"]').change(function() {
  var availability = $('input.availability:checked').map(function() {
    return $(this).attr('name');
  }).get();
  console.log(availability);
});

内容的提问来源于stack exchange，提问作者David Garcia