如何使用 Javascript 获取排序列表的总数答案

【问题标题】：How to get the total of the list ordered, with Javascript如何使用 Javascript 获取排序列表的总数
【发布时间】：2014-02-27 08:13:20
【问题描述】：

我正在制作一个在线交付网页的代码，我很难弄清楚如何输出用户订购的列表的总数。

function ListOrder(){
        document.getElementById('order').innerHTML += "<div id=\"YourOrders\">" +  + document.getElementById('FoodName').value + document.getElementById('quantity').value  + document.getElementById('Totality').value + "</div><br>";}

已编辑：我想知道如何获得总价的总和。所以，我在 document.getElementById('Totality').value 之间放置了一个 parseInt 。现在是这个样子，

function ListOrder(){
        document.getElementById('order').innerHTML += "<div id=\"YourOrders\">" +  + document.getElementById('FoodName').value + document.getElementById('quantity').value  + parseInt(document.getElementById('Totality').value) + "</div><br>";}

有人可以帮我制作一个函数或其他东西吗？请仅使用 Javascript。我还是有点陌生。

【问题讨论】：

确保您在操作数字。 .value 返回一个字符串。
哦，那我怎样才能把它转换成整数呢？
@user3359381 parseInt()
@user3359381 如果您想重新提出这个问题，您需要发布更多相关代码并更清楚地说明您的实际输出与预期输出有何不同。

标签： javascript

【解决方案1】：

function ListOrder(){
  document.getElementById('order').innerHTML +=
    "<div id=\"YourOrders\">" +
    parseInt(document.getElementById('FoodName').value) +
    parseInt(document.getElementById('quantity').value) +
    parseInt(document.getElementById('Totality').value) +
    "</div><br>";
}

【讨论】：

【解决方案2】：

您的代码的内核应如下所示（双 + 运算符已删除，重新格式化）：

function ListOrder(){
    document.getElementById('order').innerHTML +=
          "<div id=\"YourOrders\">" +  (
                document.getElementById('FoodName').value
              + document.getElementById('quantity').value
              + document.getElementById('Totality').value
          )
        + "</div><br>"
    ;
}

您的问题表述方式表明您希望输出一个由具有特定 ID 的所有 (html) 元素的内容组装而成的订单列表。

这不会可靠地工作：

ID 应该是文档唯一的。
您使用的 Js 函数不会遍历列表。

相反，请按照以下几行继续（假设您导入了jquery，这是一个跨浏览器的 dom 处理和 ajax 库（无论如何您都应该使用它:)）：

function ListOrder(){
    var e_orders = $("<div id=\"YourOrders\">");
    $("#order").append(e_orders);

    $(".FoodName").each ( function ( idx_fn, e_fn ) {
        $(e_orders).append(
            $("<div/>").append(
                 $(e_fn).val()
               + $(e_fn).nextAll('.quantity').val()
               + $(e_fn).nextAll('.Totality').val()
            );
        );
        $(e_orders).append("<br>");
    });

    return e_orders;
}

代码模板假定源数据是具有value 属性的元素，这些属性用css 类quantity、Totality 和'FoodName`` 进行标记，这些元素是兄弟元素，并且在每个项目的容器元素中是唯一的包括数量信息。它应该足够灵活，可以根据您的实际需求和 html 结构进行定制。

【讨论】：