Question

您好想在jquery中计算多个数据属性成功计算data-price，而我想计算data-fee怎么样？这是mycode

$('.checkbox').on("change", function() {
  // var links = []; //array for links
  var totalPrice = 0;

  $('.checkbox:checked').each(function() {
    // links.push($(this).data('link')); //get links
    totalPrice += parseInt($(this).data('price'), 10);
  });

  $('.price').html(totalPrice);
  //$("a").attr("href", links.join(",")); // change link

  var number = totalPrice,
    thousand_separator = '.';

  var reverse = number.toString().split('').reverse().join(''),
    thousands = reverse.match(/\d{1,3}/g);
  totalPrice = thousands.join(thousand_separator).split('').reverse().join('');

  // Print result	
  $('.price').html('IDR ' + totalPrice);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' name='qwer[]' data-price='20000' data-fee='1000' id="qwer" class="checkbox" value="20000" />apple
<input type='checkbox' name='qwer[]' data-price='30000' data-fee='2000' id="qwer" class="checkbox" value="20000" />pineaple
<input type='checkbox' name='qwer[]' data-price='40000' data-fee='3000' id="qwer" class="checkbox" value="20000" />mango

<div>
  total price :
  <span class="price" style="font-size: 1.6vw;">IDR 0</span>
</div>
<div>
  total fee :
  <span class="fee" style="font-size: 1.6vw;">IDR 0</span>
</div>

我想计算数据费用如何在jQuery中计算多个属性

谢谢

Answer 1

以与总计价格相同的方式进行操作。

$('.checkbox').on("change", function() {
  // var links = []; //array for links
  var totalPrice = 0;
  var totalFee = 0;
  
  $('.checkbox:checked').each(function() {
    // links.push($(this).data('link')); //get links
    totalPrice += $(this).data('price');
    totalFee += $(this).data('fee');
  });

  $('.price').html(totalPrice);
  //$("a").attr("href", links.join(",")); // change link

  // Print result	
  $('.price').html('IDR ' + totalPrice.toLocaleString());
  
  $('.fee').html('IDR ' + totalFee.toLocaleString());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' name='qwer[]' data-price='20000' data-fee='1000' id="qwer" class="checkbox" value="20000" />apple
<input type='checkbox' name='qwer[]' data-price='30000' data-fee='2000' id="qwer" class="checkbox" value="20000" />pineaple
<input type='checkbox' name='qwer[]' data-price='40000' data-fee='3000' id="qwer" class="checkbox" value="20000" />mango

<div>
  total price :
  <span class="price" style="font-size: 1.6vw;">IDR 0</span>
</div>
<div>
  total fee :
  <span class="fee" style="font-size: 1.6vw;">IDR 0</span>
</div>

请注意，您无需在此处使用parseInt()。 jQuery尽可能自动将数据属性解析为JSON，从而解析整数。

您可以使用toLocaleString()将逗号添加到数字中。

使用jQuery计算多数据属性

1 个答案: