JavaScript 将小数转换为整数

JavaScript converting a decimal to an integer

我有一个 php 变量..
<?=number_format($total_commission,2)?> 这具有价值 £3,400.00

然后我有一个 JavaScript 脚本计算前端的值

// Count Up
function animateValue(id, start, end, duration) {
  var obj = document.getElementById(id);
  var range = end - start;
  var minTimer = 50;
  var stepTime = Math.abs(Math.floor(duration / range));
  // never go below minTimer
  stepTime = Math.max(stepTime, minTimer);
  // get current time and calculate desired end time
  var startTime = new Date().getTime();
  var endTime = startTime + duration;
  var timer;

  function run() {
    var now = new Date().getTime();
    var remaining = Math.max((endTime - now) / duration, 0);
    var value = Math.round(end - (remaining * range));
    obj.innerHTML = value;
    if (value == end) {
        clearInterval(timer);
    }
  }

  timer = setInterval(run, stepTime);
  run();

}

var value1 = <?=$total_count?>;
var value2 = <?=$total_commission?>;
var value3 = <?=$active_refs?>;

animateValue("value1", 0, value1, 1750);
animateValue("value2", 0, value2, 1750);
animateValue("value3", 0, value3, 1750);

我遇到的问题是,在 javascript 中使用 php 变量时,它会将数字转换为整数并丢失小数值。从 PHP 到 JavaScript 时如何将数字保留为小数?

我尝试在结束变量上使用 toFixed(2) 但没有成功..

在 JavaScript 中你不能在点后定义带零的变量 1.00 Javascript 引擎清除点后数字末尾的所有零。

示例:

let oneZero = 1.0;
console.log('oneZero:',oneZero);
let twoZeros = 1.00;
console.log('twoZeros:',twoZeros);
let oneAndTen = 1.10;
console.log('1.10:',oneAndTen);
let threeZeros = 1.000;
console.log('threeZeros:',threeZeros)

要解决您的问题,您只需要像字符串一样格式化您的号码。

let formatedString = 1+".00";

但这不是最佳解决方案。你需要使用一些像 numeraljs library

在javascript中,如果需要,您可以尝试使用Number()函数将字符串转换为数字(整数或小数),您可以使用parseFloat(number)方法。

使用 Number() 的示例:

// Convert strings
Number('123'); // returns 123
Number('12.3'); // returns 12.3
Number('3.14someRandomStuff'); // returns NaN
Number('42px'); // returns NaN

使用 parseFloat() 的示例:

var text = '3.14someRandomStuff';
var pointNum = parseFloat(text);
// returns 3.14

然而,在您的特定情况下,这就是它作为示例的工作方式: (编辑、更新的代码,使用 OP 的代码,因为我现在有更多时间来清除它以备后用,有用的参考)

<?php
$total_count = (string) "£3,400.00";
$total_commission = (string) "£3,500.25";
$active_refs = (string) "£4,400.87";
?>

<div class="container2">
  <div id="value1"></div>
  <div id="value2"></div>
  <div id="value3"></div>
</div>

<script>  

// getting a float number from a formatted PHP string
var getNum = function (str) {
    var num = str.replace(/[\£\,]/mg, '');
    var num2 = parseFloat(num);
    return num2;
}

// converting the counter value back to a currency format
var convertNum = function(number){
    let numb = number;
    return numb.toLocaleString('en-GB', {style : 'currency', currency : 'GBP', minimumFractionDigits : '2', currencyDisplay : 'symbol'});
}

var value1 = getNum("<?php echo (string) $total_count ?>");
var value2 = getNum("<?php echo (string) $total_commission ?>");
var value3 = getNum("<?php echo (string) $active_refs ?>");

// Count Up
function animateValue(id, start, end, duration) {
    var obj = document.getElementById(id);
    var range = end - start;
    var minTimer = 50;
    var stepTime = Math.abs(Math.floor(duration / range));
    // never go below minTimer
    stepTime = Math.max(stepTime, minTimer);
    // get current time and calculate desired end time
    var startTime = new Date().getTime();
    var endTime = startTime + duration;
    var timer;

  function run() {
      var now = new Date().getTime();
      var remaining = Math.max((endTime - now) / duration, 0);
      var value = parseFloat(end - (remaining * range));
      obj.innerHTML = convertNum(value);
      if (value == end) {
          clearInterval(timer);
      }
  }

  timer = setInterval(run, stepTime);
  run();

}

animateValue("value1", 1, value1, 1750);
animateValue("value2", 1, value2, 1750);
animateValue("value3", 1, value3, 1750);

</script>

并且你还可以查看上面代码版本here的result/output: 或者如果它已经被删除,那么 here

也许不太重要我想指出,在您的代码中,以下行将小数转换为整数,这也必须进行编辑:

var value = Math.round(end - (remaining * range));

这一行将 return 返回一个整数。