如何在HTML Select选项标签中传递数据？

<select id="mySelect" onchange="handleSelectChange()">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<script>
function handleSelectChange() {
  var selectedValue = document.getElementById("mySelect").value;
  // 可以将selectedValue传递给后端或其他需要的地方
  console.log(selectedValue);
}
</script>

<form action="your-backend-url" method="post">
  <select name="mySelect">
    <option value="option1">Option 1</option>
    <option value="option2">Option 2</option>
    <option value="option3">Option 3</option>
  </select>
  <input type="submit" value="Submit">
</form>

<select id="mySelect" onchange="handleSelectChange()">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<script>
function handleSelectChange() {
  var selectedValue = document.getElementById("mySelect").value;
  
  // 使用AJAX发送选中的值给后端
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "your-backend-url", true);
  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      // 请求成功后的处理
      console.log(xhr.responseText);
    }
  };
  xhr.send("selectedValue=" + selectedValue);
}
</script>