如何在选择选项里面获取数组值 <td> 点击事件何时生成行？

Question

单击事件生成行时，如何在选择选项内部获取数组值？ 我试过了，生成了行，但选项为空。 var选项中的数组值。 jush将相同的数据推送10次。 我是否使用正确的forEach循环？ 请帮忙。

 $('#click').click(function() { $("#table tbody tr").remove(); var r = 10; var option = []; for (var i = 1; i <= 10; i++) { option.push("<option>selectme</option>"); } console.log(option); // for (var i = 1; i <= 10; i++) { var td = "<tr><td>number</td><td>name</td><td><select>" + option.forEach(function(e) { e; }); + "</select></td></tr>"; $("#table tbody").append(td); // } }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="table" border="solid"> <thead> <tr> <td>s.no.</td> <td>name</td> <td>class</td> </tr> </thead> <tbody> <tr> <td>2</td> <td>name2</td> <td>option</td> </tr> </tbody> </table> <button id="click">click</button> 

Answer 1

不。您使用了forEach错误的方式，因为forEach总是返回undefined 。 在这种情况下，应使用reduce ，如下所示：

<script type="text/javascript">
  $('#click').click(function () {
    $("#table tbody tr").remove();

    var r = 10;
    var option = [];
    for (var i = 1; i <= 10; i++) {
      option.push("<option>selectme</option>");
    }
    console.log(option);

    // for (var i = 1; i <= 10; i++) {
    var td = "<tr><td>number</td><td>name</td><td><select>" +
      option.reduce((acc, cur) =>
        acc + cur
      );
    +"</select></td></tr>";
    $("#table tbody").append(td);
    // }
  })
</script>

Answer 2

您可以使用forEach但是您需要做一些不同的事情。 首先，创建一个空的select元素，然后运行forEach以创建新的option元素并将它们附加到该select 。

 $('#click').click(function(){ $("#table tbody tr").remove(); var r = 10; var option = []; for (var i = 1; i <= 10; i++) { option.push("selectme"); } var td = "<tr><td>number</td><td>name</td><td><select></select></td></tr>"; $("#table tbody").append(td); const select = document.querySelector('select'); option.forEach(v => { const o = document.createElement('option'); o.textContent = v; select.appendChild(o); }); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="table" border="solid"> <thead> <tr> <td>s.no.</td> <td>name</td> <td>class</td> </tr> </thead> <tbody> <tr> <td>2</td> <td>name2</td> <td>option</td> </tr> </tbody> </table> <button id="click">click</button>