javascript - 如何将 "ons-select"的值保存到 JavaScript 的变量中？

Question

我正在尝试在 Onsen Ui 中编写一个代码，它将日期保存在一个变量中，并在 JavaScript 中显示所选的值作为警报。到目前为止，这是我的代码片段:

function exfunction() {
  var MONTH = document.getElementById("Month");
  alert(selectedItem);
}

<ons-select id="Month" onchange="editSelects()" v-model="selectedItem">
    <option value="material">January</option>
    <option value="material">Febuary</option>
    <option value="material">March</option>
    <option value="material">April</option>
    <option value="material">May</option>
    <option value="material">June</option>
    <option value="material">July</option>
    <option value="material">August</option>
    <option value="material">September</option>
    <option value="material">October</option>
    <option value="material">November</option>
    <option value="material">December</option>
</ons-select>

因此，我需要帮助将 ONS-SELECT 中所选项目的值存储在变量中以在 JavaScript 中使用。有什么建议吗？

Answer 1

在ons-select元素上使用options属性获取所有选项的节点列表，然后使用selectedIndex属性获取当前选择的选项的索引。

function editSelects() {
  const selectTag = document.getElementById("Month");
  const months = selectTag.options;
  var selectedMonth = months[selectTag.selectedIndex].value;
  alert( selectedMonth )
}

<ons-select id="Month" onchange="editSelects()" v-model="selectedItem">
    <option value="January">January</option>
    <option value="Febuary">Febuary</option>
    <option value="March">March</option>
    <option value="April">April</option>
    <option value="May">May</option>
    <option value="June">June</option>
    <option value="July">July</option>
    <option value="August">August</option>
    <option value="September">September</option>
    <option value="October">October</option>
    <option value="November">November</option>
    <option value="December">December</option>
</ons-select>