为输入的每餐创建一个带有复选框的表单

<form>
  <input type="checkbox" name="meal" value="breakfast"> 早餐<br>
  <input type="checkbox" name="meal" value="lunch"> 午餐<br>
  <input type="checkbox" name="meal" value="dinner"> 晚餐<br>
</form>

// 获取表单元素
var form = document.querySelector('form');

// 监听表单提交事件
form.addEventListener('submit', function(event) {
  event.preventDefault(); // 阻止表单默认提交行为

  // 获取选中的餐
  var selectedMeals = [];
  var checkboxes = form.querySelectorAll('input[type="checkbox"]:checked');
  checkboxes.forEach(function(checkbox) {
    selectedMeals.push(checkbox.value);
  });

  // 处理选中的餐
  if (selectedMeals.length > 0) {
    console.log('您选择的餐是：', selectedMeals);
    // 进行其他操作，如发送到服务器进行处理等
  } else {
    console.log('请至少选择一餐');
  }
});