HTML下拉框数值如何用Ajax传递到后台

Question

请问HTML代码这样写，如何写Ajax？求各位解惑!

<div class="item">
      <div class="text">所属项目：</div>
      <div class="value">
          <select id="selectLeo" class="form-control form-control-placeholder" value='${pickListModels}'>
          <option value="0" disabled selected hidden>请选择</option>
          <option value="1">项目1</option>
          <option value="2">项目2</option>
          <option value="3">项目3</option>
          <option value="4">项目4</option>
          <option value="5">项目5</option>
        </select>
      </div>
    </div>
    <div class="item">
      <div class="text">调查类型：</div>
      <div class="value">
        <select id="selectLeo" class="form-control form-control-placeholder">
          <option value="0" disabled selected hidden>请选择</option>
          <option value="1">老师</option>
          <option value="2">学生</option>
        </select>
      </div>
    </div>

Answer 1

该回答通过自己思路及引用到GPTᴼᴾᴱᴺᴬᴵ搜索,得到内容具体如下：
要使用 Ajax 将下拉框的数值传递到后台，你需要编写 JavaScript 代码来实现 Ajax 请求。以下是一个简单的示例：

// 获取下拉框元素
var projectSelect = document.getElementById("projectSelect");
var typeSelect = document.getElementById("typeSelect");

// 当选择发生变化时，发送 Ajax 请求
projectSelect.addEventListener("change", function() {
  var projectId = projectSelect.value;
  var typeId = typeSelect.value;
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "/some/url/to/server", true);
  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      if (xhr.status === 200) {
        console.log(xhr.responseText);
      } else {
        console.error(xhr.statusText);
      }
    }
  };
  xhr.send(JSON.stringify({ projectId: projectId, typeId: typeId }));
});

typeSelect.addEventListener("change", function() {
  var projectId = projectSelect.value;
  var typeId = typeSelect.value;
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "/some/url/to/server", true);
  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      if (xhr.status === 200) {
        console.log(xhr.responseText);
      } else {
        console.error(xhr.statusText);
      }
    }
  };
  xhr.send(JSON.stringify({ projectId: projectId, typeId: typeId }));
});

这段代码将监听下拉框的 change 事件，当下拉框的选项被选择时，将发送一个 Ajax POST 请求到指定的后台 URL。请求的数据是一个包含 projectId 和 typeId 属性的 JSON 对象，其中 projectId 和 typeId 分别是所选项目和调查类型的值。

你需要将 /some/url/to/server 替换为你后台接收 Ajax 请求的 URL。在后台处理 Ajax 请求时，你可以使用相应的开发语言和框架来获取请求的数据并进行处理。

---

如果以上回答对您有所帮助，点击一下采纳该答案～谢谢