如何在 JavaScript 中從多選元素中檢索選定的值？
- Susan Sarandon原創
- 2024-11-04 00:46:02766瀏覽
從多個選擇元素中檢索值
處理具有多個選擇功能的表單元素時，常見任務涉及提取所選值。這對於需要捕獲用戶偏好或選擇的場景尤其相關。
用於提取所選值的JavaScript 技術
從對於具有multiple 屬性的元素，JavaScript 提供了一種簡單的方法：
<code class="javascript">function getSelectValues(select) {
var values = [];
for (var i = 0; i < select.options.length; i++) {
if (select.options[i].selected) {
values.push(select.options[i].value || select.options[i].text);
}
}
return values;
}此函數迭代
用法範例
考慮以下HTML 標籤：
<code class="html"><select multiple>
<option>Option 1</option>
<option value="Option 2">Option 2</option>
</select>
<button onclick="
var select = document.querySelector('select');
var values = getSelectValues(select);
alert(values);
">
Show Selected Values
</button></code>
按一下按鈕時，呼叫getSelectValues 函數，所選值會顯示在警報框中。
其他注意事項
上面概述的 JavaScript 方法提供了一種從多個選擇框中檢索所選值的可靠方法。但是，值得注意的是，在某些情況下，您可能會遇到值和文字屬性的跨瀏覽器相容性問題。為了確保一致的行為，如果瀏覽器相容性是一個主要問題，請考慮使用像 jQuery 這樣的函式庫。
以上是如何在 JavaScript 中從多選元素中檢索選定的值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn