javascript - 使用 Array.push() 函数从 Ajax 数据形成 JSON 时出现问题。形成的 JSON 无法使用 jQuery 填充 tbody

Question

我正在尝试使用以下代码将数据放入我的 tbody

     function adaptSelectedBanks(banks) {

      console.log(banks.length);

        $(function() {

            banks.forEach(function (ba)
            {
                var count = 1;
                var ligne = $("<tr></tr>");
                ligne.append($("<td>" + count+ "</td>"));
                ligne.append($("<td>" + ba.name + "</td>"));
                ligne.append($("<td>" + ba.frais + "</td>"));
                    count++;
                $("#myrow").append(ligne);
            });
        });

    }

问题是我的银行数组包含 3 行，但我在表中得到的是 3 行相同的数据，即使计数保持不变!

这是银行代码

   var banks =[];
        var bank= {};

        bank.name = "Natixis";
        bank.logo = "assets/images/2.png";
        bank.frais = "300";
        banks.push(bank);

        bank.name = "XXX";
        bank.frais = "500";
        bank.logo = "assets/images/3.png";
        banks.push(bank);

        bank.name = "YYY";
        bank.frais = "700";
        bank.logo = "assets/images/4.png";
        banks.push(bank);

你能告诉我问题是什么吗？

Answer 1

您正在使用相同的银行对象并重新分配其属性。所以你的数组有 3 次相同的对象。并且你的计数变量被重置为每一行的 1，它应该在循环之外初始化，试试这个代码

function adaptSelectedBanks(banks) {
  console.log(banks.length);
  var count = 1;
  banks.forEach(function (ba) {
    var ligne = $("<tr></tr>");
    ligne.append($("<td>" + count+ "</td>"));
    ligne.append($("<td>" + ba.name + "</td>"));
    ligne.append($("<td>" + ba.frais + "</td>"));
    count++;
    $("#myrow").append(ligne);
  });
}


var banks = [];
var bank1 = {};
bank1.name = "Natixis";
bank1.logo = "assets/images/2.png";
bank1.frais = "300";
banks.push(bank1);

var bank2 = {};
bank2.name = "XXX";
bank2.frais = "500";
bank2.logo = "assets/images/3.png";
banks.push(bank2);


var bank3 = {};
bank3.name = "YYY";
bank3.frais = "700";
bank3.logo = "assets/images/4.png";
banks.push(bank3);

adaptSelectedBanks(banks);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody id="myrow">
    
  </tbody>
</table>