Question

我有一个包含对象（order）的数组和一个包含字符串（test）的数组。使用jquery可以使test输出到<div>，但不能对order做同样的事情。

我尝试使用console.log(order)来确认那里有值，然后再传递给<div id="order">。

这是我的代码：

var order = [];
var test = ["hello", "there"];

function updateCart(item) {
  var index = order.findIndex(i => i.id == item.id);
  if (index != -1) {
    order.splice(index, 1);
    order.push(item);
  } else {
    order.push(item);
  }
  console.log(order);
  console.log(test)
  $("#test").html(test);
  $("#order").html(order);

}

function plusOne(item) {
  if (item.qty < 10) {
    item.qty = item.qty + 1;
    document.getElementById((item.name).replace(/\s/g, '') + "Qty").innerHTML = item.qty;
  }
}

function minusOne(item) {
  if (item.qty > 0) {
    item.qty = item.qty - 1;
    document.getElementById((item.name).replace(/\s/g, '') + "Qty").innerHTML = item.qty;
  }
}

$("#HawaiianPlus").click(function() {
  plusOne(hawaiian);
  updateCart(hawaiian);
});

$("#HawaiianMinus").click(function() {
  minusOne(hawaiian);
  updateCart(hawaiian);
});

$("#NewYorkerPlus").click(function() {
  plusOne(newYorker);
  updateCart(newYorker);
});

$("#NewYorkerMinus").click(function() {
  minusOne(newYorker);
  updateCart(newYorker);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="test"></div>
<div id="order"></div>

我的产品类如下所示，order是包含这些产品实例的数组：

class Product {
    constructor(id, name, price, qty) {
    this.id = id;
    this.name = name;
    this.price = price; 
    this.qty = qty;
    }
}

Answer 1

让我们假设您在订单数组中有一些合理的值，例如：

[
    {name: "book", value: "5"},
    {name: "cd", value: "6"},
    {name: "spray", value: "8"},
    {name: "pen", value: "1"},
]

如评论部分所建议，您可以通过以下方式将其放入html

$("#order").html(order);

如果只需要名称，则可以执行以下操作：

$("#order").html(JSON.stringify(order.map(item => item.name)));

甚至在其中添加新行：

$("#order").html(JSON.stringify(order.map(item => item.name).join("\n")));

为什么一个数组显示而另一个不显示？

1 个答案: