js 顯示與 text() 加總的問題？

js jquery

火爆浪子 2018-06-27 15:22:46 ‧ 2966 瀏覽

分享至

這是我用 click 觸發的 event：

$('.cart_subtotal_'+prod_id).html(newVal*price);

newVal 是數量
price 是商品單價

在ＨＴＭＬ上顯示

每個商品的小計沒問題（商品乘以數量）
但，現在是要將cart_subtotal（subtotal）這些值都相加，然後印到別處去
我要如何在觸發按鈕的同時
可以同時相加這些值？
我想到的是這樣的寫法

var subtotal = parseInt($('.subtotal').text());
    $('.total-price-display').html(subtotal);

（我在 cart_subtotal 添加 subtotal 了）
當然無法運行
思路已死
請問一下能實現這種效果的函數是...？

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

2 個回答

froce

iT邦大師 1 級 ‧ 2018-06-27 15:37:41

最佳解答

我懂了，你其實問題出在不太理解html的class和id用法。
我寫一段簡單的給你看好了。

https://jsbin.com/pixixupoxa/1/edit?html,output

從你的code看到

$('.cart_subtotal_'+prod_id).html(newVal*price);

表示你的每個小計的class是 cart_subtotal_[prod_id]
如果id都不重複，何必都給一個class?

回應 2
分享
檢舉

火爆浪子 iT邦研究生 1 級 ‧ 2018-06-27 15:46:35 檢舉

a+b我會，但是因為是array（多個），要怎麼相加？

froce iT邦大師 1 級 ‧ 2018-06-27 16:07:01 檢舉

你可以去jsbin試試看，多資料也一樣啊。
JQ的each很好用。

登入發表回應

跟著鄉民看熱鬧

iT邦高手 1 級 ‧ 2018-06-27 15:59:20

應該是想問subtotal一次取到多個值，怎麼加總吧
如下：
html

 <button id="cal">計算</button>
  <table>
    <thead>
      <tr>
        <th>小計</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td class="subtotal">300</td>
      </tr>
      <tr>
        <td class="subtotal">200</td>
      </tr>
    </tbody>
    <tfoot>
      <tr>
        <td colspan="2">總計</td>
        <td id="total"></td>
      </tr>
    </tfoot>
  </table>

  $("#cal").click(function(){
     var total = 0;
    $(".subtotal").each(function(){
      total += parseInt($(this).text())
    });
    $('#total').text(total);
  });