Question

我在HTML文件中有多个标签，而且我在同时知道每个标签的价值时遇到了问题。

  function knowAllValues(){
    var color_element = document.getElementById("color");
    var size_element = document.getElementById("size");

    var color_text = color_element.options[color_element.selectedIndex].text;
    var size_text = size_element.options[size_element.selectedIndex].text;
    
    window.alert(color_text + " - " + size_text);
  }

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Example</title>
  <link rel="stylesheet" href="">
</head>
<body>
  <select id="color">
    <option value="1">Op1</option>
    <option value="2">Op2</option>
    <option value="3">Op3</option>
  </select>

  <select id="size">
    <option value="1">S</option>
    <option value="2">M</option>
    <option value="3">L</option>
    <option value="4">XL</option>
  </select>

  <button type="button" onclick="knowAllValues()">Click</button>
</body>
</html>

Answer 1

我真的不太确定你在寻找什么，但似乎你可能想要研究如何使用for loop in Javascript。这将让您遍历所有选项。

另外，你应该看看jQuery。您可以通过执行以下操作迭代所有选项值：

$('#color option').each(function(){
   alert($(this).text());
});

jsfiddle

无论哪种方式，您都需要遍历您的选项，无论是使用javascript还是jquery。每次迭代时，都可以将其存储到变量中并使用它一次显示所有变量。希望这会有所帮助。

在HTML中的多个选择标记中获取多个值

1 个答案: