如何在選擇選項里面獲取數組值 <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>