使用JavaScript顯示訂單總數

Question

我在網站上顯示了一張可供購買的物品表。 我正在使用mysql提取所有項目並將它們顯示在表中。 該表尤其包含以下內容：

<input type="hidden" name="price" id="price'.$id.'">  //id is one part of MySQL query results
<input type="text" name="count_'.$id.'">

全部顯示了約200個項目，但ID並未完全按順序排列（我發現了一些for (i = 0; i < rows.length; i++) {} JavaScript代碼，但是ID卻沒有按順序排列，這對我來說不是一個好選擇）。

我想使用JavaScript顯示一個訂單的總和，而我對JS則沒有經驗。 非常感謝您的建議。

Answer 1

您可能會濫用jQuery ：

function orderTotal()
{
   var total=0;
   $('input[name="price"]').each(function(){
      var price = parseFloat($(this).val());
      var amount = parseFloat($('input[name="count_'+$(this).attr('name').substring(5)+'"]').val());
      total += price+amount;
   });
   return total;
}

Answer 2

我建議您將它們包裝在另一個元素中，讓我們使用div 。 在此添加一個課程，比如說moneyline

<div class="moneyline">
    <input class="price" type="hidden" name="price" id="price'.$id.'">  //id is one part of MySQL query results
    <input class="quantity" type="text" name="count_'.$id.'">
</div>

我將使用jQuery提供示例，並提供一些觸發它的按鈕：

$('#someButton').on('click', function(){
    var total = 0;
    $('.moneyline').each(function(){
        var price = parseInt($(this).find('.price'), 10);
        var quantity = parseInt($(this).find('.quantity'), 10);
        total+= quantity*price;
    });
    alert( total );
});

Answer 3

考慮將類添加到要計數的每個元素，並在下面的stackoverflow上查看答案。 您應該能夠為該類的每次出現創建一個計數器，並在html中顯示此變量

如何使用Javascript而不是GetElementById來getElementByClass？

<div class="item"> ... <your inputs> ... </div>