如何在更改时计算账单/硬币的数量？

本文介绍了如何在更改时计算账单/硬币的数量？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想在改变时计算硬币的数量。我的代码问题是，它不适用于最后一个硬币（1cent，2cent），尽管我在我的代码中实现了它们。

我的html代码

 < input type =numberclass =calculateid =moneytochangeplaceholder = €> 
< p id =e500> < / p为H. 
< p id =e200> < / p为H. 
< p id =e100> < / p为H. 
< p id =e50> < / p为H. 
< p id =e20> < / p为H. 
< p id =e10> < / p为H. 
< p id =e5> < / p为H. 
< p id =e2> < / p为H. 
< p id =e1> < / p为H. 
< p id =e05> < / p为H. 
< p id =e02> < / p为H. 
< p id =e01> < / p为H. 
< p id =e005> < / p为H. 
< p id =e002> < / p为H. 
< p id =e001> < / p为H.

（由于欧元中的e，e存在）

我的jquery代码

  $（document）.ready （function（）{
 $（。calculate）。bind（keyup change input paste，function（）{
 
 var billsAndCoins = [500，200，100，50， 
 var number = {}; 
 
 var money = $（＃moneytochange ）.val（）; 
 billsAndCoins.forEach（function（i）{
 number [i] =（money  - （money％i））/ i; 
 $（＃e + i.toString（）。replace（'。'，''））。html（number [i] +*+ i）; 
 money = money％i; 
}）; 
 
}）; 
}）;

我的css代码

 输入{
 text-align：center; 
 font-size：3vw; 
保证金：0 17％; 
宽度：60％; 
 border：none; 
 border-bottom：4px solid＃7C4DFF; 
概述：无; 
 font-family：'Raleway'，sans-serif; 
填充：1％3％1％3％; 
过渡：边界半径0.3s缓出; 
不透明度：50％; 
} 
 input：focus {
 border-radius：1vw; 
}

解决方案

美分是由于浮点数的不准确性，其余的钱变成类似0.0099999999856而不是0.01的值。

这里是您的代码转换成以整数美分而不是小数计算避免浮点问题：

 $（document）.ready（function ）{$（。calculate）。bind（keyup change input paste，function（）{var billsAndCoins = [50000，20000，10000，5000，2000，1000，500，200，100，50，20，10 ，5,2,1]; var number = {}; var money = Math.round（$（＃moneytochange）.val（）* 100）; billsAndCoins.forEach（function（entry）{number [entry] = （money  -  money％entry）/ entry; $（＃e+ entry）.html（number [entry] +*+ （条目/ 100））; money = money％entry; }）; }};}）;

 input {text-align：中央; font-size：3vw;保证金：0 17％;宽度：60％; border：none; border-bottom：4px solid＃7C4DFF;概要：无; font-family：'Raleway'，sans-serif;填充：1％3％1％3％;过渡：边界半径0.3s缓解; opacity：50％;} input：focus {border-radius：1vw;}

 < script src =https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js>< / script>< input type =数字class =calculateid =moneytochangeplaceholder =€>< p id =e50000> 0 *< / p>< p id =e20000> 0 *< / p>< p id =e10000> 0 *< / p>< p id =e5000> 0 *< / p>< p id =e2000> 0 *< < p id =e200> 0 *< p id =e1000> 0 *< / p>< p id =e500> 0 *< / p> < p id =e100> 0 *< / p>< p id =e50> 0 *< / p>< p id =e20> 0 *< / p>< p id =e10> 0 *< / p>< p id =e5> 0 *< / p>< p id =e2> 0 *< / p>< p id =e1> 0 *< / p>

I want to compute the numbers of coins when making change. My problem with my code is, that it does not work for the last coins (1cent, 2cent), although I implemented them in my code.

Link to the code

my html code

  <input type="number" class="calculate" id="moneytochange" placeholder="€">
  <p id="e500"> </p>
  <p id="e200"> </p>
  <p id="e100"> </p>
  <p id="e50"> </p>
  <p id="e20"> </p>
  <p id="e10"> </p>
  <p id="e5"> </p>
  <p id="e2"> </p>
  <p id="e1"> </p>
  <p id="e05"> </p>
  <p id="e02"> </p>
  <p id="e01"> </p>
  <p id="e005"> </p>
  <p id="e002"> </p>
  <p id="e001"> </p>

(the "e" is there because of the "e" in Euro )

my jquery code

$(document).ready(function(){
  $(".calculate").bind("keyup change input paste", function(){

  var billsAndCoins = [500, 200, 100, 50, 20, 10, 5, 2, 1, 0.5, 0.2, 0.1,   0.05, 0.02, 0.01];
  var number = {};

  var money = $("#moneytochange").val();
  billsAndCoins.forEach(function(i) {
    number[i] = (money - (money % i))/ i;
    $("#e" + i.toString().replace('.','')).html(number[i] + " * " + i);
    money = money % i;
    });

  });
});

my css code

input {
text-align: center;
font-size: 3vw;
margin: 0 17%;
width: 60%;
border: none;
border-bottom: 4px solid #7C4DFF;
outline: none;
font-family: 'Raleway', sans-serif;
padding: 1% 3% 1% 3%;
transition: border-radius 0.3s ease-out;
opacity: 50%;
}
input:focus {
border-radius: 1vw;
}

解决方案

The reason that it fails for the cents is that the remaining money becomes something like 0.0099999999856 instead of 0.01 because of floating point inaccuracies.

Here is your code converted to calculate with integer cents instead of decimals, thereby avoiding the floating point problems:

$(document).ready(function(){
  $(".calculate").bind("keyup change input paste", function(){

    var billsAndCoins = [50000, 20000, 10000, 5000, 2000, 1000, 500, 200, 100, 50, 20, 10, 5, 2, 1];
    var number = {};

    var money = Math.round($("#moneytochange").val() * 100);
    billsAndCoins.forEach(function(entry) {
      number[entry] = (money - money % entry)/ entry;
      $("#e" + entry).html(number[entry] + " * " + (entry/100));
      money = money % entry;
    });

  });
});

input {
	text-align: center;
	font-size: 3vw;
	margin: 0 17%;
	width: 60%;
	border: none;
	border-bottom: 4px solid #7C4DFF;
	outline: none;
	font-family: 'Raleway', sans-serif;
	padding: 1% 3% 1% 3%;
	transition: border-radius 0.3s ease-out;
	opacity: 50%;
}
input:focus {
	border-radius: 1vw;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" class="calculate" id="moneytochange" placeholder="€">
<p id="e50000">0 *</p>
<p id="e20000">0 *</p>
<p id="e10000">0 *</p>
<p id="e5000">0 *</p>
<p id="e2000">0 *</p>
<p id="e1000">0 *</p>
<p id="e500">0 *</p>
<p id="e200">0 *</p>
<p id="e100">0 *</p>
<p id="e50">0 *</p>
<p id="e20">0 *</p>
<p id="e10">0 *</p>
<p id="e5">0 *</p>
<p id="e2">0 *</p>
<p id="e1">0 *</p>

这篇关于如何在更改时计算账单/硬币的数量？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！