Question

我有这个代码：

<SELECT onChange="chData(this,this.value)">
<OPTION VALUE="_MIPS-LRSYSCPU">MIPS
<OPTION VALUE="_XXCEC-LRSYSCPU">% CEC
<OPTION VALUE="_nIFL-LRSYSCPU">nIFL
</SELECT>

，我需要使用javascript来获取HTML PAGE中所有选项值的值（而不是文本）。问题是In知道该值包含单词“ -LRSYSCPU”，但是我不知道前面的部分（示例_MIPS）。第二个问题是我在选择中没有ID，那么我该如何选择选项值？我已经看到人们使用以下代码：

var e = document.getElementById("elementId");
var value = e.options[e.selectedIndex].value;
var text = e.options[e.selectedIndex].text;

但是我没有ID，所以我不知道该怎么办。

我需要使用以下三个值创建一个数组：_MIPS-LRSYSCPU，_XXCEC-LRSYSCPU和_nIFL-LRSYSCPU。谢谢

Answer 1

如果您在整个页面上仅使用一次选择，则可以使用-

let selectTags = document.getElementsByTagName（'select'）;

然后将返回您的HTMLCollection数组[选择]。现在，您可以使用selectTags [0]（属于 HTMLCollection 类型的对象）进行选择。该对象包含 childNodes 。遍历子节点将为您提供所有选项并提供值。

Answer 2

要获取页面中包含子字符串“ LRSYSCPU”的所有选项值，可以使用以下代码：

// Grab all the options in the page
const options = document.querySelectorAll('option');

// `filter` out the options that have the "LRSYSCPU" substring
// in their values
const filtered = [...options].filter(({ value }) => value.includes('-LRSYSCPU'));

// Iterate over those filtered options with `map` and return only
// the values
const values = filtered.map(({ value }) => value);
console.log(values);

<select>
<option value="temp">temp</option>
<option value="_MIPS-LRSYSCPU">MIPS</option>
<option value="_XXCEC-LRSYSCPU">% CEC</option>
<option value="temp2">temp2</option>
<option value="_nIFL-LRSYSCPU">nIFL</option>
</select>

文档

Answer 3

您可以使用document.querySelectorAll()查找以-LRSYSCPU结尾的所有选项。然后，您可以遍历它们并测试是否选择了它们。

let options = document.querySelector("option[value$=-LRSYSCPU]");
for (let i = 0; i < options.length; i++) {
    if (options[i].selected) {
        value = options[i].value;
        text = options[i].text;
        break;
    }
}

如果使用jQuery，它具有选择器扩展名:selected，因此您可以无循环地进行此操作：

var option = $("option[value$=-LRSYSCPU]:selected");
var value = option.val();
var text = option.text();

如何在javascript中获取选项值

3 个答案: