精华内容
下载资源
问答
  • JavaScript数值千分位格式化的两种简单实现方法
    2021-06-14 07:58:37

    在对数值进行格式化的时候,一个常见的问题是按照千分位格式化,网上对这个问题已经有很多种解决方法了,还可以利用Array.prototype.reduce方法来实现千分位格式化。

    function formatNumber(num) {

    if (isNaN(num)) {

    throw new TypeError("num is not a number");

    }

    var groups = (/([\-\+]?)(\d*)(\.\d+)?/g).exec("" + num),

    mask = groups[1], //符号位

    integers = (groups[2] || "").split(""), //整数部分

    decimal = groups[3] || "", //小数部分

    remain = integers.length % 3;

    var temp = integers.reduce(function(previousValue, currentValue, index) {

    if (index + 1 === remain || (index + 1 - remain) % 3 === 0) {

    return previousValue + currentValue + ",";

    } else {

    return previousValue + currentValue;

    }

    }, "").replace(/\,$/g, "");

    return mask + temp + decimal;

    }

    Array的reduce方法在IE9以下不支持,不过,我们可以基于ECMAScript 3来实现一个reduce方法。

    在JavaScript中,字符串的replace方法的匹配模式参数除了字符串以外还可以是一个正则表达式,下面是利用String.prototype.replace方法来实现千分位格式化的具体代码:

    function formatNumber(num) {

    if (isNaN(num)) {

    throw new TypeError("num is not a number");

    }

    return ("" + num).replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, "$1,");

    }

    (\d{1,3})是一个捕获分组,可以用$1来反向引用,?=(\d{3})+(?:$|\.)是正向断言,表示匹配1到3个数字后面必须跟3个数字,但不含最后的3个数字或者3个数字和小数点。

    以上这篇JavaScript数值千分位格式化的两种简单实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

    更多相关内容
  • 前端开发中经常会碰到用 JavaScript格式化数字,最最常见的是格式化金额,一般格式化金额需要千分位分隔,保留2位小数等等。简单的功能函数类似的代码网上有很多:JavaScript 代码:/*** 将数值四舍五入(保留2位小数)...

    前端开发中经常会碰到用 JavaScript 格式化数字,最最常见的是格式化金额,一般格式化金额需要千分位分隔,保留2位小数等等。

    简单的功能函数

    类似的代码网上有很多:

    JavaScript 代码:

    /**

    * 将数值四舍五入(保留2位小数)后格式化成金额形式

    *

    * @param num 数值(Number或者String)

    * @return 金额格式的字符串,如'1,234,567.45'

    * @type String

    */

    function formatCurrency(num) {

    num = num.toString().replace(/\$|\,/g,'');

    if(isNaN(num))

    num = "0";

    sign = (num == (num = Math.abs(num)));

    num = Math.floor(num*100+0.50000000001);

    cents = num%100;

    num = Math.floor(num/100).toString();

    if(cents<10)

    cents = "0" + cents;

    for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)

    num = num.substring(0,num.length-(4*i+3))+','+

    num.substring(num.length-(4*i+3));

    return (((sign)?'':'-') + num + '.' + cents);

    }

    或者

    JavaScript 代码:

    function fmoney(s, n) {

    /*

    * 参数说明:

    * s:要格式化的数字

    * n:保留几位小数

    * */

    n = n > 0 && n <= 20 ? n : 2;

    s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed(n) + "";

    var l = s.split(".")[0].split("").reverse(),

    r = s.split(".")[1];

    t = "";

    for (i = 0; i < l.length; i++) {

    t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : "");

    }

    return t.split("").reverse().join("") + "." + r;

    }

    //调用

    fmoney(9.7,2);//9.70

    fmoney('12345.675910', 3);//12,345.676

    更加完善的功能函数

    这些代码基本能很好的运行。不过关系到经济利益的时候,还要考虑舍去或者舍入几厘。大家懂的,每个用户几厘钱可能带来巨大的经济收益。就比如说收手续费,如果一笔手续费计算出来是 3.4521元,精确到分一般都会收 3.46 元。当然如果是付出去,那可能就是直接舍去了,一般会计算为 3.45 元。

    以前收集过类似方法,http://www.css88.com/archives/5307,不过在使用的时候会有BUG,JS 浮点型计算的精度问题。所以抽时间修复了一下:

    JavaScript 代码:

    function number_format(number, decimals, dec_point, thousands_sep,roundtag) {

    /*

    * 参数说明:

    * number:要格式化的数字

    * decimals:保留几位小数

    * dec_point:小数点符号

    * thousands_sep:千分位符号

    * roundtag:舍入参数,默认 "ceil" 向上取,"floor"向下取,"round" 四舍五入

    * */

    number = (number + '').replace(/[^0-9+-Ee.]/g, '');

    roundtag = roundtag || "ceil"; //"ceil","floor","round"

    var n = !isFinite(+number) ? 0 : +number,

    prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),

    sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,

    dec = (typeof dec_point === 'undefined') ? '.' : dec_point,

    s = '',

    toFixedFix = function (n, prec) {

    var k = Math.pow(10, prec);

    console.log();

    return '' + parseFloat(Math[roundtag](parseFloat((n * k).toFixed(prec*2))).toFixed(prec*2)) / k;

    };

    s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');

    var re = /(-?\d+)(\d{3})/;

    while (re.test(s[0])) {

    s[0] = s[0].replace(re, "$1" + sep + "$2");

    }

    if ((s[1] || '').length < prec) {

    s[1] = s[1] || '';

    s[1] += new Array(prec - s[1].length + 1).join('0');

    }

    return s.join(dec);

    }

    console.log(number_format(2, 2, ".", ","))//"2.00"

    console.log(number_format(3.7, 2, ".", ","))//"3.70"

    console.log(number_format(3, 0, ".", ",")) //"3"

    console.log(number_format(9.0312, 2, ".", ","))//"9.03"

    console.log(number_format(9.00, 2, ".", ","))//"9.00"

    console.log(number_format(39.715001, 2, ".", ",", "floor")) //"39.71"

    console.log(number_format(9.7, 2, ".", ","))//"9.70"

    console.log(number_format(39.7, 2, ".", ","))//"39.70"

    console.log(number_format(9.70001, 2, ".", ","))//"9.71"

    console.log(number_format(39.70001, 2, ".", ","))//"39.71"

    console.log(number_format(9996.03, 2, ".", ","))//"9996.03"

    console.log(number_format(1.797, 3, ".", ",", "floor"))//"1.797"

    参数有点多,你可以根据你自己的需求去修改。

    推荐的类库 Numeral.js 和 accounting.js

    Numeral.js

    一个用于格式化和操作数字的JavaScript库。数字可以被格式化为货币,百分比,时间,几个小数位数,千分位等等。 您也可以随时创建自定义格式。

    官网及文档:http://numeraljs.com/

    GitHub:https://github.com/adamwdraper/Numeral-js

    accounting.js

    一个轻量级的JavaScript库,用于格式化数字,金额和货币等。

    官网及文档:http://openexchangerates.github.io/accounting.js/

    GitHub:accounting.js

    展开全文
  • 主要介绍了JS数字千分位格式化实现方法,结合实例形式总结分析了JS实现数字千分位格式化的常用技巧,包括字符串的分割、拼接、遍历及正则操作等相关实现技巧,需要的朋友可以参考下
  • 这可能是一个坏主意……Comma Thousands Inputlabel, input, button{font-size:1.25em}// insert commas as thousands separatorsfunction addCommas(n){var rx= /(\d+)(\d{3})/;return String(n).replace(/^\d+/, ...

    这可能是一个坏主意……

    Comma Thousands Input

    label, input, button{font-size:1.25em}

    // insert commas as thousands separators

    function addCommas(n){

    var rx= /(\d+)(\d{3})/;

    return String(n).replace(/^\d+/, function(w){

    while(rx.test(w)){

    w= w.replace(rx, '$1,$2');

    }

    return w;

    });

    }

    // return integers and decimal numbers from input

    // optionally truncates decimals- does not 'round' input

    function validDigits(n, dec){

    n= n.replace(/[^\d\.]+/g, '');

    var ax1= n.indexOf('.'), ax2= -1;

    if(ax1!= -1){

    ++ax1;

    ax2= n.indexOf('.', ax1);

    if(ax2> ax1) n= n.substring(0, ax2);

    if(typeof dec=== 'number') n= n.substring(0, ax1+dec);

    }

    return n;

    }

    window.οnlοad= function(){

    var n1= document.getElementById('number1'),

    n2= document.getElementById('number2');

    n1.value=n2.value='';

    n1.οnkeyup= n1.οnchange=n2.οnkeyup=n2.οnchange= function(e){

    e=e|| window.event;

    var who=e.target || e.srcElement,temp;

    if(who.id==='number2') temp= validDigits(who.value,2);

    else temp= validDigits(who.value);

    who.value= addCommas(temp);

    }

    n1.οnblur= n2.οnblur= function(){

    var temp=parseFloat(validDigits(n1.value)),

    temp2=parseFloat(validDigits(n2.value));

    if(temp)n1.value=addCommas(temp);

    if(temp2)n2.value=addCommas(temp2.toFixed(2));

    }

    }

    Input Thousands Commas

    Any number

    2 decimal places

    展开全文
  • 可参考链接 js保留两位小数方法总结 代码 将 1234567.00 转换为 1,234,567.00...DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> ...

    可参考链接

    代码

    1234567.00 转换为 1,234,567.00

    <!DOCTYPE html>
    <html>  
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>JS</title>
            <script type="text/javascript" src="jquery.min.js"></script>
        </head>
    <style>
      body {
          text-align: center;
      }
    </style>
      <body>
          <div id="box">
              <input type="number" name="number" id="number">
              <button class="btn" onclick="doClick()">保留两位小数</button>
              <button class="btn" onclick="doClick2()">转换为千分位格式</button>
          </div>
          <script type="text/javascript">
            function doClick(){
                var numberValue = $("#number").val()
                alert("numberValue = " + numberValue)
                var resultValue = to2bits(numberValue)
                resultValue = resultValue.toFixed(2);
                alert("resultValue.toFixed 2 = " + resultValue)
            }
    
            function doClick2(){
                var numberValue = $("#number").val()
                var resultValue = numToMoneyField(numberValue)
                alert("resultValue = " + resultValue)
            }
    
            function to2bits(flt) {
                if (parseFloat(flt) == flt) {
                    return Math.round(flt * 100) / 100; // 到2位小数
                }
                else
                    return 0;
            }
    
            //转换为千分位格式
            //将1234567.00转换为1,234,567.00
            function numToMoneyField(inputString) {
                regExpInfo = /(\d{1,3})(?=(\d{3})+(?:$|\.))/g;
                var ret = inputString.toString().replace(regExpInfo, "$1,");
                return ret;
            }
           </script>
      </body>
    </html>
    
    展开全文
  • /*** 将数值四舍五入后格式化.** @param num 数值(Number或者String)* @param cent 要保留的小数位(Number)* @param isThousand 是否需要千分位 0:不需要,1:需要(数值类型);* @return 格式的字符串,如'1,234,567.45'...
  • 数字金额千分位.zip

    2020-08-05 19:31:20
    该控件封装十分完美,可媲美手机里的计算器输入效果。压缩包包含js文件,以及文本框赋值,取值示例。该控件封装十分完美,可媲美手机里的计算器输入效果。
  • js千分位 正则匹配

    2021-09-16 00:25:06
    js千分位 正则匹配 var num = '123456789.45748'; var str = a.replace(/(\d)(?=(\d{3})+\.)/g, '$1,');//使用正则替换,每隔三个数加一个',' // 使用正则替换,每隔三个数加一个',' // 结果:'123,456,789.46'
  • 业务需求:金额在千分位要加上,并且保留两位小数 话不多说,直接上代码 金额千分位添加 function format_number(s) { if (s == null || s == ‘’ || s==0) { return 0 } s = s.toString().replace(/^(\d*)$/,’$1....
  • Js数字千分位

    2013-05-31 17:24:00
    html xmlns="http://www.w3.org/1999/xhtml" &gt; &lt;head&gt; &lt;title&gt;标题页&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;script ...
  • /*** 格式化数字为千分位显示;* @param 要格式化的数字;* @return*/public static String fmtMicrometer(String text){DecimalFormat df = null;if(text.indexOf(".") > 0){if(text.length() - text.indexOf("....
  • /*** 千分位方法* @param text* @return*/public static String fmtMicrometer(String text){DecimalFormat df = null;if(text.indexOf(".") > 0){if(text.length() - text.indexOf(".")-1 == 0){df = new ...
  • 千分位

    2019-03-20 18:06:00
    export function fmt(value, digit, thousand = true) { if (!validNumber(value)) return '-'; value = (Number(value) || 0).toFixed(digit);...转载于:https://www.cnblogs.com/guidan/p/10566610.html
  • 在util.js中定义方法包含金额添加过滤千分位,验证金额格式等const MoneyTest = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/;// 金额添加千分位const comdify = function (n) {if(!n) return n;let str = n.split('.');let...
  • 本文实例讲述了JS基于正则实现数字千分位用逗号分隔的方法。分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js千分位...
  • String str = DecimalFormat.getNumberInstance().format(1245600000);... http://swzhinan.com/ 本文由站长原创或收集,不代表本站立场,如若转载,请注明出处:http://www.swzhinan.com/post/28.html
  • decimal保留千分位

    2019-09-22 08:17:16
    public static string Decimal2Str(decimal value) { if (value == 0) { return string.Empty; } else ...转载于:https://www.cnblogs.com/GreenGrass/archive/2013/04/24/3040243.html
  • js实现千分位分隔符

    2021-12-07 10:13:49
    核心思想: 判断数字参数是否为负数,如果为负数,则保留负号(flag) 将数字拆分成整数部分和小数部分(fractional,若不存在小数部分,则值为undefined),保留小数部分 将整数部分转换成字符串,再...DOCTYPE html
  • 金额千分位展示

    2019-09-24 15:53:05
    //千分位展示金额 function get_thousand_num(num) { return num.toString().replace(/\d+/, function (n) { // 先提取整数部分 return n.replace(/(\d)(?=(\d{3})+$)/g, function ($1) { // 对整数部分添加...
  • // 用逗号分隔千分位 function handle(str){ let splitArr = str.split('.'); let frontArr = splitArr[0].split('').reverse() if(splitArr[0].length > 3) { let i = 3; while(frontArr[i] && ...
  • DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-...
  • 数字去除千分位逗号

    千次阅读 2020-04-27 12:28:12
    页面跳转,需要将带千分位的数字去除逗号,网上找的方法比较麻烦还理不清思路,同事帮忙写了一个,感谢同事~ // utils.jsx 文件 /** * 数字去除千分位逗号 * / export const delComma = num => { // 先定义一...
  • 第一步: 需要封装一个js -代码 最后的getInputValue一定要用 ...// 金额添加千分位 const comdify = function (n) { if (!n) return n; let str = n.split('.'); let re = /\d{1,3}(?=(\d{3})+$)/g; let n1 = .
  • 另:千分位与数值的转换网上大多数都可以使用,我在这里也是引用了网上的一些代码,仅供参考 <!-- html代码 --> <el-form-item label="总金额"> {{newNum(allprice)}} </el-form-item> <!-- ...
  • js金钱千分位分隔符

    2021-06-30 20:03:53
    金钱千分位分隔符: function moneyFormat(nMoney){ if(nMoney == 0){ return ‘0.00’; } if(nMoney && nMoney != null){ nMoney = String(nMoney); var sLeft = nMoney.split(’.’)[0], sRight = nMoney....
  • js 千分位显示方法

    千次阅读 2018-10-09 17:02:20
    应用中金钱数目常常使用千分位分隔,使用js写了一个简单的函数。 解决方案 可以使用字符串操作,也可以数组操作,不过最简单的还是正则替换。 参考方案 假设输入为1234567.89,正则中先提取出数额的整数部分n=...
  • <!DOCTYPE html> <html lang="en"> <head> ...meta charset="UTF-8">... * @description 给数字或者金额千分位添加逗号 * @param money {number} 必须传入数字类型 * @param pre
  • 利用jquery实现上述效果其实非常简单,首先在html部分创建div容器,设置好最外层对齐方式以及大小。再利用jquery对动态数据进行html拼接就可以了。 内容块定义 <div style="width:100%;padding: 0 14%;text-align...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,855
精华内容 1,142
关键字:

html千分位