jQuery 追加不适用于 parseInt var

Question

我有一些具有基本价格和额外价格的产品元素。目标是将额外价格添加到基本价格，并用新计算的价格替换基本价格。

下面是我目前的代码，console.logs 给了我所有正确的反馈，但价格不会附加到 .subtotal div，无论我尝试什么。

jQuery(document).ready(function() {

  var extra = jQuery('.extra');
  extra.each(function() {
    var $this = jQuery(this).html().replace(/[^\d,]/g, '');

    var subtotal_dest = jQuery(this).siblings('.subtotal');
    jQuery(subtotal_dest).css('border', '2px solid green');

    var subtotal = jQuery(this).siblings('.subtotal').html().replace(/[^\d,]/g, '');

    var newtotal = parseInt($this) + parseInt(subtotal);
    var rendered_total = '€ ' + newtotal;

    jQuery(rendered_total).appendTo(subtotal_dest);

    console.log($this);
    console.log(subtotal);
    console.log(rendered_total);
    console.log('-');
  });

});

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js'></script>
</head>

<body>

  <div class="product" style="margin-bottom:20px;">
    <!--subtotal should be €10 -->
    <div class="subtotal">€ 5,00</div>
    <div class="extra">€ 5,00</div>
  </div>
  <div class="product" style="margin-bottom:20px;">
    <!--subtotal should be €20-->
    <div class="subtotal">€ 15,00</div>
    <div class="extra">€ 5,00</div>
  </div>
  <div class="product" style="margin-bottom:20px;">
    <!--subtotal should be €30-->
    <div class="subtotal">€ 25,00</div>
    <div class="extra">€ 5,00</div>
  </div>

</body>

</html>

Answer 1

$('€ ' + newtotal') 没有任何用处。

替换

jQuery(rendered_total)

和

jQuery("<div>").text(rendered_total).

完整的可运行代码：

jQuery(document).ready(function() {

  var extra = jQuery('.extra');
  extra.each(function() {
    var $this = jQuery(this).html().replace(/[^\d,]/g, '');

    var subtotal_dest = jQuery(this).siblings('.subtotal');
    jQuery(subtotal_dest).css('border', '2px solid green');

    var subtotal = jQuery(this).siblings('.subtotal').html().replace(/[^\d,]/g, '');

    var newtotal = parseInt($this) + parseInt(subtotal);
    var rendered_total = '€ ' + newtotal;

    jQuery("<div>").text(rendered_total).appendTo(subtotal_dest);

    console.log($this);
    console.log(subtotal);
    console.log(rendered_total);
    console.log('-');
  });

});

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js'></script>
</head>

<body>

  <div class="product" style="margin-bottom:20px;">
    <!--subtotal should be €10 -->
    <div class="subtotal">€ 5,00</div>
    <div class="extra">€ 5,00</div>
  </div>
  <div class="product" style="margin-bottom:20px;">
    <!--subtotal should be €20-->
    <div class="subtotal">€ 15,00</div>
    <div class="extra">€ 5,00</div>
  </div>
  <div class="product" style="margin-bottom:20px;">
    <!--subtotal should be €30-->
    <div class="subtotal">€ 25,00</div>
    <div class="extra">€ 5,00</div>
  </div>

</body>

</html>

jQuery 追加不适用于 parseInt var

jQuery Append not working with parseInt var

jquery

append

parseint