javascript - 选择元素后制作订单列表

Question

我正在使用 HTML、CSS 和 JS/JQ 逐步创建订单。到目前为止，我已经在很多帮助下完成了步骤功能，我的下一个任务是创建一个列表，其中包含已使用正确的 .name .selected 的元素和 .price 用于该 li -item，然后将所有选定的元素价格乘以订单列表底部的一个总价。

I have made a JSFiddle这也形象化了我想要完成的事情。

有没有一种有效的方法来做到这一点？我不知道如何才能实现这一目标，所以我请求外面的人给我一个良好的开端或一些我可以坚持下去的东西。

谢谢!

Answer 1

要为您目前拥有的商品获得正确的名称和价格，您只需要拥有如下内容:

var allLikes = $('.selected');

...获取已选择的每个元素。

你能做的是在每个元素中，而不是你现在在这里:

<li class="bananas nomarking" data-id="one">
  Hamburger
  <span class="banana_price">€ 8</span>
</li>

这样做:

<li class="bananas nomarking" data-id="one">
  <span class="banana_name">Hamburgers</span>
  <span class="banana_price">€ 8</span>
</li>

现在，您可以为 allLikes 中的每个元素选择 banana_name 和 banana_price。如果您遍历 allLikes 并选择每一个并将它们添加到您已经拥有的 topay div，那么您应该已经准备就绪。