亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用 Javascript 的千位分隔符

使用 Javascript 的千位分隔符

冉冉說 2023-01-06 09:41:31
我使用oninput屬性使input字段在插入時自動生成千位分隔符,并且有效。但我想要實現的是,它也允許放置點.字符,因為我想獲得兩位小數,到目前為止這是我的代碼不起作用:function separator(input) {   let nums = input.value.replace(/,/g, '');  if(!nums)return;  input.value = parseFloat(nums).toLocaleString(); }function addition() {  var number1 = document.getElementById('number1').value;  var number2 = document.getElementById('number2').value;  number1 = number1.replace(/[,]+/g, '');  number2 = number2.replace(/[,]+/g, '');    if (number1 == "")    number1 = 0;  if (number2 == "")    number2 = 0;      var result = parseFloat(number1) + parseFloat(number2);  result = result.toFixed(2);  if (!isNaN(result)) {      document.getElementById('total').value = result;  }  document.getElementById('total').onchange();}<table>  <tr>    <td><input onkeyup="addition()" oninput="separator(this)" type="text" id="number1" placeholder="123,456.16"></td>    <td>+</td>    <td><input onkeyup="addition()" oninput="separator(this)" type="text" id="number2" placeholder="123,456.16"></td>    <td>=</td>    <td><input onchange="separator(this);" type="text" name="total" id="total" placeholder="total" readonly></td>  </tr></table>即使我已經設置了input帶有屬性的字段type="text",它仍然不能放置點.字符。如何解決這個問題?
查看完整描述

2 回答

?
哈士奇WWW

TA貢獻1799條經驗 獲得超6個贊

function seprator(input) {

  let nums = input.value.replace(/,/g, '');

  if (!nums || nums.endsWith('.')) return;

  input.value = parseFloat(nums).toLocaleString();

}

<input type="text" id="inputSep" oninput="seprator(this)" placeholder="123,456,789"/>

代碼筆示例鏈接


查看完整回答
反對 回復 2023-01-06
?
一只萌萌小番薯

TA貢獻1795條經驗 獲得超7個贊

考慮讓瀏覽器使用Intl.NumberFormat為您完成工作


const $input = document.querySelector('input');

const $output = document.querySelector('div');


$input.addEventListener('input', (evt) => {

  $output.innerText = Intl.NumberFormat().format(evt.target.value);

});

<input>

<div></div>


您可以自定義有關輸出數字格式的許多內容,在您的情況下,您可能希望調整minimumFractionDigits或maximumFractionDigits設置:


const $input = document.querySelector('input');

const $output = document.querySelector('div');


$input.addEventListener('input', (evt) => {

  $output.innerText = Intl.NumberFormat(undefined, {

    maximumFractionDigits: 2

  }).format(evt.target.value);

})

<input>

<div></div>


查看完整回答
反對 回復 2023-01-06
  • 2 回答
  • 0 關注
  • 207 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號