JavaScript 或 JQuery 从通过 for 循环生成的多个选择表中的选择选项中获取正确的选择值答案

【问题标题】：JavaScript or JQuery Take right selected value from select options from multiple select tables generated thro for loopJavaScript 或 JQuery 从通过 for 循环生成的多个选择表中的选择选项中获取正确的选择值
【发布时间】：2018-07-04 05:02:55
【问题描述】：

我已尝试从 Google 和之前提出的问题中获取解决方案，但问题和答案仅涉及具有多个选项的选择。为了澄清更多，当我为循环生成代码以在屏幕上创建多个选择然后使用 JavaScript 获取 selectedIndex 或值并使用警报检查是否采用正确的值时，然后只有来自第一个选择表的选定选项的值通过生成for 循环重复显示。请找到以下代码：

<body>
  <script>

    // JSON code getting g named array throgh JSON.parse method
    for (g=0; g<m.length; g++) {
      n += "  <select id=\"mySelect\" onchange=\"myFunction()\">";
      n += "    <option> - Select Option - </option>";
      n += "<option>A</option>";
      n += "    <option>B</option>";
      n += "    <option>C</option>";
      n += "    <option>D</option>";
      n += "  </select>";
    } // end of for loop
  
    document.getElementById("demo").innerHTML = n;   

    // in between some code

    function myFunction() {
      var y = document.getElementById("mySelect");
      var j = y.selectedIndex;
      var b = y.options[j].text;
      alert ("Your answer is: " + b);
    } // end of myFunction
  </script>
  <p id="demo"></p>
</body>

执行此代码时，例如if (arrayG.length is 5)，然后选择选项在屏幕上显示五次，是完美的，当我们从第一个选择选项循环警报中选择选项时显示完美选择的选项。例如如果我们从第一个选择中选择 C，则警报显示 C，但是当我们从其他四个选择元素中选择选项时，它仍然显示 C，即从第一个选择元素中选择的选项。

我们希望我们的代码显示从通过上述 for 循环生成的不同 5 个选择元素中正确选择的选项。

请求帮助，因为我们已经挖掘了很多答案。

【问题讨论】：

ID 必须在 HTML 文档中是唯一的。
“请求帮助，因为我们已经挖掘了很多答案。” - 建议你先“挖掘”一些基础知识，然后学习一些初学者的教程或类似的东西。
感谢您的 cmets，是的，我是初学者。我们可以请求教程在哪里可以找到解决这个问题的方法。我已经尝试在 for 循环中使用唯一 id 和 value。
尝试了 "+i+" 的值以获得函数和 html 文档中的唯一值，但仍然没有达到预期的结果
onchange="foo(this)", function foo(element) { ... } #LookMaNoIds

标签： javascript jquery json ajax dom-events

【解决方案1】：

正如 Cbroe 强烈暗示的那样，您需要将 select 元素传递给带有 'this' 的方法，然后使用该引用来查找选定的值。

var m = 3;
var n = "";
// JSON code getting g named array throgh JSON.parse method
for(g=0; g<m; g++) {
  n += "  <select id=\"mySelect" 
  n += g;
  n += "\" onchange=\"myFunction(this)\">";
  n += "    <option> - Select Option - </option>";
  n += "<option>A</option>";
  n += "    <option>B</option>";
  n += "    <option>C</option>";
  n += "    <option>D</option>";
  n += "  </select>";
} // end of for loop

document.getElementById("demo").innerHTML = n;   

// in between some code

function myFunction(element) {
  var j = e.selectedIndex;
  var b = e.options[j].text;
  alert ("Your answer is: " + b);
} // end of myFunction

jsbin demo

或者你可以传递索引并以这种方式使用 id 找到它。

var m = 3;
var n = "";

// JSON code getting g named array throgh JSON.parse method
for(g=0; g<m; g++) {
  n += "  <select id=\"mySelect" 
  n += g;
  n += "\" onchange=\"myFunction(";
  n += g;
  n += ")\">";
  n += "    <option> - Select Option - </option>";
  n += "<option>A</option>";
  n += "    <option>B</option>";
  n += "    <option>C</option>";
  n += "    <option>D</option>";
  n += "  </select>";
} // end of for loop

document.getElementById("demo").innerHTML = n;   

// in between some code

function myFunction(index) {
  var y = document.getElementById("mySelect" + index);
  var j = y.selectedIndex;
  var b = y.options[j].text;
  alert ("Your answer is: " + b);
} // end of myFunction

jsbin demo

您的代码/问题结构非常清楚您不具备处理 javascript 基础知识的能力。你需要做一些介绍 javascript 的课程，否则你会继续挣扎，并写出很多糟糕的代码。

【讨论】：