Javascript toLocaleString onKeyUp 事件

Javascript toLocaleString onKeyUp Event

我需要一些帮助来解决这个问题,我试图在输入时从 <input> 标签打印出 value,它应该用千位分隔符打印出来,但它 return 我输入的数字,更准确地说 它不起作用 。我该如何解决这个问题...?

function cDes(e) {
  var k = e.currentTarget;
  var prc = k.value; //example value: 123456789
  var prc_f = prc.toLocaleString('de-DE');
  var oDiv = document.getElementById('cOut');
  if (e.keyCode == 13) {
    if (prc.length < 1) {
      oDiv.innerHTML = 'FREE';
    } else {
      oDiv.innerHTML = prc_f; //expected output value: 123.456.789
    }
  } else {
    oDiv.innerHTML = '...';
  }
}
<input type='number' id='price' onKeyUp='cDes(event)'>

<div id='cOut'></div>

在使用之前将输入字符串转换为数字 Number.toLocaleString():

var prc_f = Number(prc).toLocaleString('de-DE');

示例:

// get a reference to the element once
var oDiv = document.getElementById('cOut');

function cDes(e) {
  var prc = e.target.value; //example value: 123456789
  if (e.keyCode == 13) {
    if (prc.length < 1) {
      oDiv.innerHTML = 'FREE';
    } else {
      // you only need to convert the input when you display it
      oDiv.innerHTML = Number(prc).toLocaleString('de-DE'); //expected output value: 123.456.789
    }
  } else {
    oDiv.innerHTML = '...';
  }
}
<input type='number' id='price' onKeyUp='cDes(event)'>

<div id='cOut'></div>

这个答案可能与您的预期有点偏差,但是如果objective是显示价格和符号,您可以使用Intl.NumberFormat

function cDes(e) {
  var k = e.currentTarget;
  var prc = k.value; //example value: 123456789
  var prc_f = nf.format(prc);
  var oDiv = document.getElementById('cOut');
  if (e.keyCode == 13) {
    if (prc.length < 1) {
      oDiv.innerHTML = 'FREE';
    } else {
      oDiv.innerHTML = prc_f; //expected output value: 123.456.789
    }
  } else {
    oDiv.innerHTML = '...';
  }
}
var nf = new Intl.NumberFormat('de-DE', {
  style: 'currency',
  currency: 'EUR',
  minimumFractionDigits: 0,
  maximumFractionDigits: 2
});
<input type='number' id='price' onKeyUp='cDes(event)'>

<div id='cOut'></div>