做手机端页面我们常常遇到数字,而在Safari浏览器下这些数字会默认显示电话号码,于是我们就用到了补坑的方法加入<meta>标签:

<meta name="format-detection" content="telephone=no">
这个标签的意义在于将数字不被看成电话号码,于是就万事大吉了O(∩_∩)O,但是如果是一个订餐电话,那么在加入这个标签之后,订餐电话就变成了数字,就不能直接拨号了于是乎我们想到了用千位符老表示数字从而区分电话号码和数字 千位符

在西方,在表示很大的数字的时候,会以每3位为一个间隔进行分隔,分隔的符号就是英文逗号,由于中文里面,第3位是“千”,因此,数字中的这个“逗号”也被称为“千位分隔符”。

之所以会以每3位进行分隔,是英文的读数有关的,举个例子:英语的987,654,321读法是: nine hundred and eighty-seven billion six hundred and fifty-four thousand three hundred and twenty-one。

其关键的数值单位,如billionthousand正好就是千分分隔符的位置。可见这种分隔是和西方数值阅读方法相辅相成的。

但是对于中文用户而言,这种风格反而是一种尴尬。我们的大数值单位主要就是“万”和“亿”,如果按照这种标准进行分割的话,应该是每4位进行分隔。所以,当我们一开始看到3位分隔的数字的时候,一定会奇怪这分隔的方式有些不按套路。

那有没有解决的办法呢;

办法一:

方法一:使用正则表达式


语法如下:


String(Number).replace(/(\d)(?=(\d{3})+$)/g, "$1,");

举例:


String(123456789).replace(/(\d)(?=(\d{3})+$)/g, "$1,");
办法二:

方法二:使用toLocaleString()方法


语法如下:


Number.toLocaleString('en-US');

举例:


(123456789).toLocaleString('en-US');

结果是:123,456,789


对于中文场景下,toLocaleString('en-US')中的'en-US'理论上是可以缺省的,也就是直接(123456789).toLocaleString()也是可以得到123,456,789。但是如果你的产品可能海外用户使用,则保险起见,还是保留'en-US'


另外,对于IE edge之前的版本,Number.toLocaleString()会自动补上两位小数,如果是不需要的,需要自己额外过滤掉。


使用千位分隔符(逗号)表示web网页中的大数字的更多相关文章

  1. 请使用千位分隔符(逗号)表示web网页中的大数字

    方法一:使用正则表达式 语法如下: String(Number).replace(/(\d)(?=(\d{3})+$)/g, "$1,"); 举例: String(12345678 ...

  2. 千位分隔符在web开发中的作用

    有千位分隔符会被认为是数字,否则在移动端会被直接识别成手机号 在开发实战中主流实现方式是添加meta标签 <meta name="format-detection" cont ...

  3. JS给数字加千位分隔符

    本文原链接:https://www.jianshu.com/p/928c68f92c0c JavaScript实现千位分隔符 将普通的数字转换为带千位分隔符格式的数字字符串是一个非常常见的问题,千位分 ...

  4. js千位符 | js 千位分隔符 | js 金额格式化

    js 千位分隔符 千位分隔符,其实就是数字中的逗号.依西方的习惯,人们在数字中加进一个符号,以免因数字位数太多而难以看出它的值.所以人们在数字中,每隔三位数加进一个逗号,也就是千位分隔符,以便更加容易 ...

  5. 千位分隔符(js 实现)

    最近被同事问到js如何实现给长数字添加千位分隔符,即 1344444 ---> 13,444,444 这是一个很常见的前端面试题.看起来简单,刚开始我都懒得写. 仔细一想,挺考逻辑的,实现方法有 ...

  6. golang 千位分隔符

    项目需求将统计出的数字以千位分隔符分隔的形式展示(如将 1234567.89 格式化为 1,234,567.89),而 golang 的标准库中并无这样的函数. 万能的 google 找到解决办法,可 ...

  7. web网页中使用vlc插件播放相机rtsp流视频

    可参考: 使用vlc播放器做rtsp服务器 使用vlc播放器播放rtsp视频 使用vlc进行二次开发做自己的播放器 vlc功能还是很强大的,有很多的现成的二次开发接口,不需配置太多即可轻松做客户端播放 ...

  8. Web网页中动态数据区域的识别与抽取 Dynamical Data Regions Identification and Extraction in Web Pages

    Web网页中动态数据区域的识别与抽取 Dynamical Data Regions Identification and Extraction in Web Pages Web网页中动态数据区域的识别 ...

  9. C#开发BIMFACE系列50 Web网页中使用jQuery加载模型与图纸

    BIMFACE二次开发系列目录     [已更新最新开发文章,点击查看详细] 在前一篇博客<C#开发BIMFACE系列49 Web网页集成BIMFACE应用的技术方案>中介绍了目前市场主流 ...

随机推荐

  1. Csocket基本原理

    我通过几个采用 CSocket 类编写并基于 Client/Server (客户端 / 服务端)的网络聊天和传输文件的程式  ,在调试这些程式的过程中,追踪深入至 CSocket 类核心源码 Sock ...

  2. 简述C/C++调用lua中实现的自定义函数

    1.首先说下目的,为什么要这么做 ? 正式项目中,希望主程序尽量不做修改,于是使用C/C++完成功能的主干(即不需要经常变动的部分)用lua这类轻量级的解释性语言实现一些存在不确定性的功能逻辑:所以, ...

  3. android monkey测试学习

    前提是:有安卓环境,能用adb命令 一.Monkey 测试的目的? 该工具可用于测试稳定性. 开发人员结合monkey 打印的日志 和系统打印的日志,解决测试中出现的问题 二.Monkey 测试的特点 ...

  4. C# 爬虫 Jumony html解析

    前言 前几天写了个爬虫,然后认识到了自己的不足.感谢 "倚天照海- -" ,我通过你推荐的文章,意外的发现了html解析的类库——Jumony. 研究了2天,我发现这个东西简单粗暴 ...

  5. MySQL(七)MySQL常用函数

    前言 上一篇给大家介绍了,MySQL常用的操作符其实已经是非常的详细了,现在给大家分享的是MySQL的常用函数.希望对我和对大家都有帮助. 一.字符串函数 1.1.LOWER.lcase(string ...

  6. element ui datePicker 设置当前日期之前的日期不可选

    pickerOptions0: { disabledDate(time) { return time.getTime() < Date.now() - 8.64e7 } },

  7. Java filter拦截器的使用

    1.web.xml配置 <!-- 验证是否登录 拦截功能 --> <filter> <filter-name>isLogin</filter-name> ...

  8. 垃圾收集器Serial 、Parallel、CMS、G1

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt378 这里介绍4个垃圾收集器,如果进行了错误的选择将会大大的影响程序的性能. ...

  9. Java环境的搭建

    一.JDK的下载 JDK又称Java SE,可以从Oracle公司的官网上https://www.oracle.com/index.html下载. 1.打开Oracle官网.将光标移到[Menu]-[ ...

  10. c# 读取excel数据的两种方法(转)

    转载自:http://developer.51cto.com/art/201302/380622.htm, 方法一:OleDb: 用这种方法读取Excel速度还是非常的快的,但这种方式读取数据的时候不 ...