阿拉伯数字转简(繁)体中文(支持自定义)

业务开发过程中,客户提出表单中某些含有金额的输入框输入阿拉伯数字后要给出中文提示(比如:输入123456789.05,提示信息:一亿二千三百四十五万六千七百八十九点零五),以防止多输入或者错输入导致数据错误的问题。

适用场景

  • 适用于需要转换阿拉伯数字与中文数字的场景
  • 支持科学记数法字符串的转换
  • 支持口语化
  • 支持自定义转换(不论是兆,京还是厘都可以用)
  • 对超大数支持用争议教少的万万亿代替亿亿
  • 也中文数字再转回阿拉伯数字

先简单实现一个前端界面(最后贴出前端代码)

numtochar

安装

$ npm install nzh --save
$ bower install nzh --save

引用

var Nzh = require("nzh");
var nzhcn = require("nzh/cn"); //直接使用简体中文
var nzhhk = require("nzh/hk"); //繁体中文

简单示例分析

var nzhcn = Nzh.cn;                 // 首先引入nzh.cn文件

nzhcn.encodeS(100111);              // 转中文小写 >> 十万零一百一十一
nzhcn.encodeB(100111);              // 转中文大写 >> 壹拾万零壹佰壹拾壹
nzhcn.encodeS("1.23456789e+21");    // 科学记数法字符串 >> 十二万三千四百五十六万万七千八百九十万亿
nzhcn.toMoney("100111.11");         // 转中文金额 >> 人民币壹拾万零壹佰壹拾壹元壹角壹分

方法介绍

//nzh.cn默认已包含以下方法
encodeS(num,options) //转中文小写
encodeB(num,options) //转中文大写
toMoney(num,options) //转中文金额
decodeS(zh_num) //中文小写转数字
decodeB(zh_num) //中文大写转数字

options 说明

  • tenMin: 十的口语化开关, 默认值为 false。(注: Nzh.cn中的encodeS方法默认 true)
  • ww: "万万"化开关, 默认值为 true
  • complete: 输出完整金额开关, toMoney 函数专用配置, 默认 false
  • outSymbol: 输出金额前缀字符, toMoney 函数专用配置, 默认 true
// options.tenMin

// encodeS默认true
nzhcn.encodeS("13.5");                 // 十三点五
nzhcn.encodeS("13.5", {tenMin:false}); // 一十三点五
// encodeB默人false
nzhcn.encodeB("13.5");                 // 壹拾叁點伍
nzhcn.encodeB("13.5", {tenMin:true});  // 拾叁點伍

// options.ww

//Nzh.cn和Nzh.hk未引入兆、京等单位,超千万亿位时,默认以争议较少的万万亿为单位
nzhcn.encodeS(1e16);                // 一万万亿
nzhcn.encodeS(1e16, {ww: false});   // 一亿亿

// options.complete

nzhcn.toMoney("1");                        //人民币壹元整
nzhcn.toMoney("1",{complete:true});        //人民币壹元零角零分
nzhcn.toMoney("0.1");                      //人民币壹角
nzhcn.toMoney("0.1",{complete:true});      //人民币零元壹角零分

//outSymbol  默认 true
nzhcn.toMoney("1");                        //人民币壹元整
nzhcn.toMoney("1",{outSymbol:false});      //壹元整

自定义样式

可以通过 new Nzh(langs) 实现自定义。

var nzh = new Nzh({
    ch: "〇壹贰叁肆伍陆柒捌玖",      // 数字字符
    ch_u: "个十百千万亿兆京",       // 数位单位字符,万以下十进制,万以上万进制,个位不能省略
    ch_f: "负",                   // 负字符
    ch_d: "点",                   // 小数点字符
    m_u: "元角分厘",              // 金额单位
    m_t: "人民币",                // 金额前缀
    m_z: "正"                    // 金额无小数后缀
});
nzh.encode("10001000000000000"); // 壹京〇壹兆
nzh.decode("壹兆");              // 1000000000000
nzh.toMoney("1.234");           // 人民币壹元贰角叁分肆厘

前端案例代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>数字转中文</title>
<style>
.divStyle{
	margin:0px auto;
	width:600px;
	height:460px;
	border:1px dashed #f00;	
}
.fieldestStyle{
	margin-top:10px;
	height:100px;
}
.inputStyle{
	height:30px;
	width:300px;
}
.buttonStyle{
	height:36px;
	width:50px;
	text-align:center;
}
.resultStyle{
	margin-top:15px;
}
</style>
<!-- 依赖外部文件 -->
<script type="text/javascript" src="nzh.js"></script>
<script type="text/javascript" src="nzh.cn.js"></script>
<!-- 依赖jQuery -->
<script type="text/javascript" src="jquery.min.js"></script>

</head>
<body>
 <div class="divStyle">
	<h3 style="text-align:center;">数字转中文</h3>
	<form>
	  <fieldset class="fieldestStyle">
		<legend>数字转简体中文</legend>
			<input type="text" class="inputStyle" id="num1" value=""/>
			<button type="button" class="buttonStyle" onclick="jisuan1();">计算</button>
			<div id="result1" class="resultStyle"></div>
	  </fieldset>
	  <fieldset class="fieldestStyle">
		<legend>数字转繁体中文</legend>
			<input type="text" class="inputStyle" id="num2" value=""/>
			<button type="button" class="buttonStyle" onclick="jisuan2();">计算</button>
			<div id="result2" class="resultStyle"></div>
	  </fieldset>
	  <fieldset class="fieldestStyle">
		<legend>数字转金额</legend>
			<input type="text" class="inputStyle" id="num3" value=""/>
			<button type="button" class="buttonStyle" onclick="jisuan3();">计算</button>
			<div id="result3" class="resultStyle"></div>
	  </fieldset>
	</form>
 
 </div>   
</body>
<script type="text/javascript">
$(document).ready(function () {
	
});

$("#num1").keyup(function(){
		var num1 = $("#num1").val();
		//千分位分割
		//$("#num1").val(Number(num1).toLocaleString('en-US'));
		var nzhcn = Nzh;      
		var encodeS = nzhcn.encodeS(num1);     // 转简体中文 >> 十三点五
		$("#result1").text(encodeS);
	});
$("#num2").keyup(function(){
		var num2 = $("#num2").val();
		//千分位分割
		//$("#num2").val(Number(num2).toLocaleString('en-US'));
		var nzhcn = Nzh;      
		var encodeB = nzhcn.encodeB(num2);     // 转繁体中文 >> 壹拾叁點伍
		$("#result2").text(encodeB);
	});
$("#num3").keyup(function(){
		var num3 = $("#num3").val();
		//千分位分割
		//$("#num3").val(Number(num3).toLocaleString('en-US'));
		var nzhcn = Nzh;      
		var encodeM = nzhcn.toMoney(num3,{complete:true});     // 转人民币 >> 人民币壹元零角零分
		$("#result3").text(encodeM);
	});

function jisuan1(){
	var num1 = $("#num1").val();
	//千分位分割
	$("#num1").val(Number(num1).toLocaleString('en-US'));
	var nzhcn = Nzh;      
	var encodeS = nzhcn.encodeS(num1);     // 转简体中文 >> 十三点五
	$("#result1").text(encodeS);

}

function jisuan2(){
	var num2 = $("#num2").val();
	//千分位分割
	$("#num2").val(Number(num2).toLocaleString('en-US'));
	var nzhcn = Nzh;      
	var encodeB = nzhcn.encodeB(num2);    // 转繁体中文 >> 壹拾叁點伍
	$("#result2").text(encodeB);

}

function jisuan3(){
	var num3 = $("#num3").val();
	//千分位分割
	$("#num3").val(Number(num3).toLocaleString('en-US'));
	var nzhcn = Nzh;      
	var encodeM = nzhcn.toMoney(num3,{complete:true});    // 转人民币 >> 人民币壹元零角零分
	$("#result3").text(encodeM);

}

</script>
</html>

其他信息

本文案例:测试案例
测试页面:输入数字测试
详细参考:详细使用教程

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值