因为自己大学毕业以后一直从事网上银行的开发工作,所以工作中经常遇到把金额转化为大写的情况。起初只有人民币一种币种,将金额数字翻译成中文大写的形式在各种票据中很常见,时至今日依然还在使用,在网络上很容易能找到翻译的代码。而最近在开发“贸易金融”的需求时,涉及到进口信用证的开立功能,而进口证的申请书中除了人民币之外,还涉及到很多种外币供用户选择,比如美元、日元、英镑等等。同时还要求把金额翻译成英文的形式,并把选择的币种加在金额翻译前面一同显示。这就比仅仅把金额翻译成中文大写难了一些,因为英文的翻译和中文不同,但弄懂了英文翻译规则以后,就很容易实现了。
本篇主要介绍一个中英文金额大写转换器,这个转换器的核心是JS代码,也是在实际工作中用到的,这里把JS代码稍加改造,放到HTML页面中。为了方便起见,我们把涉及到的HTML、JS、CSS统一放在一个HTML文件中,这样可以用浏览器直接打开,当然在实际工作中最好把他们放在不同的文件。下面对这个工具简单介绍。
工具的整体布局和我之前的一篇“大乐透号码生成”的工具的布局基本一致(详见 http://www.cnblogs.com/Y-oung/p/7756851.html),设置了一个下拉列表(“选择币种”)来选择不同的币种,这里仅列举了一部分币种。下面是“输入金额”项,需要在输入框输入金额,这里仅允许输入数字和小数点,控制最多输入11位,同时小数点后最多应该保留两位,否则会报错。当这两项都输入完成以后,点击“转化为大写”按钮,即可转化为中英文大写金额,并且在“中文大写”下面显示翻译的中文大写,在“英文大写”下面显示翻译的英文大写。
页面样式:
如果大家在工作或学习中遇到将金额数字转化为中文大写或英文大写的情况,不妨参考一下这个工具。
参考代码:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>中英文金额大写转换器</title> <style type="text/css"> #table {width:800px; height:500px;margin:10px;border:2px solid #000000;box-shadow: 10px 10px 5px;border-radius:50px;} .buttonStyle {height:40px;margin:20px;font-size:20px;background-color:#6495ED;color:white;border-radius:10px;} .oneStyle {margin-left:150px;margin-top:10px;font-family:sans-serif;font-size:20px;} .oneStyle1 {margin-left:150px;margin-top:30px;font-family:sans-serif;font-size:20px;} .InputText {width:150px;height:20px;margin:10px;} span {border-radius: 50%;color: #FFFFFF;padding:3px;font-size:13px;} </style> </head> <body> <div id="table"> <div> <h1 style="text-align:center">中英文金额大写转换器</h1> </div> <div class="oneStyle"> 选择币种:<select id="currency" class="InputText" title="币种"> <option value="">-----请选择-----</option> <option value="CNY">人民币</option> <option value="GBP">英镑</option>