与 getElementsByTagName 相关的问题

Question

我的页面中有两个 select 标签。其中每一个都有几个选项。现在我只想访问第二个 select 框，但由于我使用了 getElementByTagName("options") 所以它只获取第一个选项 tag.I 我无法访问第二个选项标签。

我的代码在这里：

function myFunction() {
  var x = document.getElementById("mySelect_two").selectedIndex;
  alert(document.getElementsByTagName("option")[x].value); 
}

<!DOCTYPE html>
<html>
  <body>

  Select your favorite fruit:
  <select id="mySelect_one">
    <option value="apple">Apple</option>
    <option value="orange">Orange</option>
    <option value="pineapple">Pineapple</option>
    <option value="banana">Banana</option>
  </select>

  <select id="mySelect_two">
    <option value="India">India</option>
    <option value="Nepal">Nepal</option>
    <option value="Spain">Spain</option>
    <option value="Mexico">Mexico</option>
  </select>

  <p>Click the button to return the value of the selected fruit.</p>

  <button type="button" onclick="myFunction()">Try it</button>

  </body>
</html>

Answer 1

有选项

var sel = document.getElementById("mySelect_two");
var selectedIndex = sel.selectedIndex;
var value = sel.options[selectedIndex].value;

使用 getElementsByTagName

var sel = document.getElementById("mySelect_two");
var selectedIndex = sel.selectedIndex;
var value = sel.getElementsByTagName("option")[selectedIndex].value;

Answer 2

您需要在 select 而不是整个文档

上按标签名称获取元素

function myFunction() 
{
    var select = document.getElementById("mySelect_two");
    var x = select.selectedIndex;
    alert(select.getElementsByTagName("option")[x].value); 
}

Answer 3

使用以下脚本获取选定的选项值：

var e = document.getElementById("mySelect_two");
var str = e.options[e.selectedIndex].value;
alert(str)

<select id="mySelect_two">
<option value="India">India</option>
<option value="Nepal" selected>Nepal</option>
<option value="Spain">Spain</option>
<option value="Mexico">Mexico</option>
</select>

与 getElementsByTagName 相关的问题

issues related to getElementByTagName

html

javascript

tags

jquery

getelementsbytagname