checkbox实现勾选返回对象

要实现勾选返回对象，可以使用以下步骤：

1. 创建一个包含多个checkbox的表单。
2. 为每个checkbox添加一个value属性，用于标识该选项。
3. 给每个checkbox添加一个事件监听器，当被勾选时触发。
4. 在事件监听器中，创建一个空对象，并将当前勾选的checkbox的value属性作为对象的属性名，将勾选状态作为属性值。
5. 将对象返回给调用方，以便进一步处理。

以下是示例代码：

<form id="myForm">
  <label>
    <input type="checkbox" name="option1" value="option1"> Option 1
  </label>
  <label>
    <input type="checkbox" name="option2" value="option2"> Option 2
  </label>
  <label>
    <input type="checkbox" name="option3" value="option3"> Option 3
  </label>
  <button type="submit">Submit</button>
</form>

const form = document.getElementById('myForm');

form.addEventListener('submit', (event) => {
  event.preventDefault();
  
  const formData = {};

  const checkboxes = form.querySelectorAll('input[type=checkbox]:checked');

  checkboxes.forEach((checkbox) => {
    formData[checkbox.value] = true;
  });

  console.log(formData);
  // 输出类似 {option1: true, option3: true} 的对象
});

在上面的代码中，我们首先获取表单元素，并为其添加一个submit事件监听器（注意要调用event.preventDefault() 阻止表单默认的提交行为）。然后，我们创建一个空对象formData，并获取所有被勾选的checkbox元素。我们使用forEach方法遍历所有被勾选的checkbox，将其value属性作为对象的属性名，将值设置为true，并将其添加到formData对象中。最后，我们输出formData对象。