如何在表单中选择多个值:使用ajax响应进行选择

<form id="myForm">
  <input type="checkbox" name="option1" value="value1"> Option 1
  <input type="checkbox" name="option2" value="value2"> Option 2
  <input type="checkbox" name="option3" value="value3"> Option 3
  <button type="button" onclick="submitForm()">Submit</button>
</form>

<script>
function submitForm() {
  var form = document.getElementById("myForm");
  var selectedValues = [];
  
  // 遍历所有复选框，获取被选中的值
  var checkboxes = form.querySelectorAll('input[type="checkbox"]');
  checkboxes.forEach(function(checkbox) {
    if (checkbox.checked) {
      selectedValues.push(checkbox.value);
    }
  });
  
  // 使用Ajax将选中的值发送到服务器进行处理
  // 请根据实际情况修改以下代码
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "your-server-url", true);
  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      // 请求成功处理
    }
  };
  xhr.send(JSON.stringify(selectedValues));
}
</script>

<form id="myForm">
  <select name="options" multiple>
    <option value="value1">Option 1</option>
    <option value="value2">Option 2</option>
    <option value="value3">Option 3</option>
  </select>
  <button type="button" onclick="submitForm()">Submit</button>
</form>

<script>
function submitForm() {
  var form = document.getElementById("myForm");
  var selectedValues = [];
  
  // 获取选中的值
  var select = form.querySelector('select[name="options"]');
  var selectedOptions = select.selectedOptions;
  for (var i = 0; i < selectedOptions.length; i++) {
    selectedValues.push(selectedOptions[i].value);
  }
  
  // 使用Ajax将选中的值发送到服务器进行处理
  // 请根据实际情况修改以下代码
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "your-server-url", true);
  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      // 请求成功处理
    }
  };
  xhr.send(JSON.stringify(selectedValues));
}
</script>