货币提取 jQuery

Question

点击任何货币（例如 ,721.90）应该自动提取和 return $0。

目前正在 returning $NaN。我正在使用 ES6 Intl.NumberFormat("en-US") 为数字提供货币格式。

var name1 = {
  name: "John",
  money: 44721.90
};
var name2 = {
  name: "Mayer",
  money: 16715.79
};

var names = [name1, name2];

function show() {
  var numFormat = new Intl.NumberFormat("en-US");
  for (var i = 0; i < names.length; i++) {
    $(".money").append('<div class="extract' + [i] + '"><span class="name">' + names[i].name + ' </span><span class="budget"> $' + numFormat.format(names[i].money) + '</span></div><br>');
  }
}

show();

function extraction() {
  for (var i = 0; i < names.length; i++) {
    //var text = $(".coin" + [i]).text();
    $(".extract" + [i]).click(function() {
      var currentCoin = $(this).find('.budget');
      var difference = $(this).find('.budget') - $(this).find('.budget');
      //var difference = (Number($(currentCoin).text().replace('$','')) - Number($(currentCoin).text().replace('$','')));
      $(currentCoin).html('$' + difference);
    })
  }
}

extraction();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="money"></div>

Answer 1

在 var difference 中，您正在选择一个带有 $ 和 , 的字符串，这在数字中是无效的。你需要把那些从字符串中取出来，像这样的那一行：

var difference = parseFloat($(this).find('.budget').text().replace(',','').replace('$','')) - parseFloat($(this).find('.budget').text().replace(',','').replace('$',''));

参见this jsfiddle。

编辑：

如果您决定使用美元符号以外的东西，您可以使用正则表达式 /[0-9\.]+/g 来匹配。我认为这个解决方案实际上要好得多。 Here's 一个 jsfiddle，我用 getFloat() 函数替换了以前的更改。这适用于任何种类的货币。

Answer 2

你不能使用 var difference = $(this).find('.budget') - $(this).find('.budget'); 因为它们是 jQuery 对象，如果你想使用它们的数值，我建议你最初使用 data- 属性存储它们。

示例：

var name1 = {
  name: "John",
  money: 44721.90
};
var name2 = {
  name: "Mayer",
  money: 16715.79
};

var names = [name1, name2];

function show() {
  var numFormat = new Intl.NumberFormat("en-US");
  for (var i = 0; i < names.length; i++) {
    // I've added a data-rawvalue attribute, which will store the raw value for you to use in sums
    $(".money").append('<div class="extract' + [i] + '"><span class="name">' + names[i].name + ' </span><span class="budget" data-rawvalue="' + names[i].money + '"> $' + numFormat.format(names[i].money) + '</span></div><br>');
  }
}

show();

function extraction() {
  for (var i = 0; i < names.length; i++) {
    $(".extract" + [i]).click(function() {
      var currentCoin = $(this).find('.budget');
      
      // Here, we use .data("rawvalue") to get the raw value we stored earlier
      var difference = $(this).find('.budget').data("rawvalue") - $(this).find('.budget').data("rawvalue");
      
      $(currentCoin).html('$' + difference);
    })
  }
}

extraction();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="money"></div>

货币提取 jQuery

currency extraction jQuery

arrays

jquery

operations