js價格限制
- 不會出現精度問題
- 不會有科學計數法
- input輸入後有千分位符
- input輸入時限制只能輸入特定範圍數據
1、基本input都是進行字符串驗證限制,因爲轉金額驗證會更麻煩,處理大數值的問題
2、超過16位的數值都會有精度問題,因爲計算機的進制是二進制,進位是按二進制,不是十進制的四捨五入,同時js支持的數值位數有限(引入BigNumber處理超過16位的數值)
bigNumber相關用法
https://github.com/MikeMcl/bignumber.js/
/**
* 價格格式限制
* 必須加格式限制屬性 n-format
* e.g:
* 11位整數,5位小數
* <input class="form-control price" n-format="11,5"/>
*/
// reg = '^(0|[1-9]\\d{0'+','+f[0]+'}|0\\.\\d{1,'+f[1]+'}|[1-9]\\d{0,'+f[0]+'}\\.\\d{1,'+f[1]+'})$';
$('.price').blur(function (el) {
var target = el.currentTarget;
var value = el.currentTarget.value;
var f = $(target).attr("n-format").split(',');
$(target).val(toStr(value, Number(f[1])))
})
$('.price').focus(function (el) {
var target = el.currentTarget;
var value = el.currentTarget.value;
$(target).val(value.replace(/,/g, ''))
})
$('.price').bind('input propertychange',function (el) {
var target = el.currentTarget;
var value = el.currentTarget.value;
var f = $(target).attr("n-format").split(',');
var l2 = Number(f[1]);
value = value.replace(/[\u4e00-\u9fa5]+/g, ""); //驗證非漢字
value = value.replace(/[^\d.]/g, ""); //清除"數字"和"."以外的字符
value = value.replace(/^\./g, ""); //驗證第一個字符是數字而不是
value = value.replace(".", "$#$").replace(/\./g, "").replace("$#$", "."); //只保留第一個小數點, 清除多餘的
value = value.replace(RegExp('^(0)*(\\d+)\\.(\\d{'+l2+'}).*$'), '$2.$3'); //只能輸入5個小數
value = value.replace(/^(0{1,})(\d{1,}.*)/,'$2'); // 去除開頭的多餘的0
$(target).val(value);
})
$('.price').keyup(function (el) {
var target = el.currentTarget;
var value = el.currentTarget.value;
var f = $(target).attr("n-format").split(',');
var l1 = Number(f[0]);
if (value.toString().indexOf('.') != -1){
if (value.toString().substring(0,value.toString().indexOf('.')+1).length > l1){
value = value.toString().substring(0,value.toString().indexOf('.')+1).slice(0,l1+1) + value.toString().substring(value.toString().indexOf('.')+1,value.toString().length);
}
}else {
value=value.slice(0,l1)
}
$(target).val(value);
})
/**
* 數量格式限制 : 默認限制8位
*/
$('.num').blur(function (el) {
var target = el.currentTarget;
var value = el.currentTarget.value;
var reg = /^(0|[1-9]\d{0,7})$/;
if (!value.match(reg)) {
value = '0';
}
$(target).val((value))
})
$('.num').bind('input propertychange',function (el) {
var target = el.currentTarget;
var value = el.currentTarget.value;
value = value.replace(/[\u4e00-\u9fa5]+/g, ""); //驗證非漢字
value = value.replace(/[^\d.]/g, ""); //清除"數字"和"."以外的字符
value = value.replace(/^\./g, ""); //驗證第一個字符是數字而不是
value = value.replace(".", ''); //只保留第一個小數點, 清除多餘的
value = value.replace(/^(0|[1-9]\d{0,7}).*$/, '$1'); //只能輸入8位整數
value = value.replace(/^(0{1,})(\d{1,}.*)/,'$2'); // 去除開頭的多餘的0
$(target).val(value);
})
/**
* 將數字保留5位小數、將整數位使用千分位
* @param str
* @returns {string}
*/
function toStr(str, decimal) {
str = String(str);
var c1 = str.split(".");
if($.trim(c1[0]) == ''){
var temp = '0.';
for (var i = 0; i < decimal; i++) {
temp+='0'
}
return temp;
}
if (c1.length > 1 && c1[1].length > 5) {
str = str.substr(0, c1[0].length + 6);
}
var c2 = str.split(".");
str = segmentation(c2[0]);
if (c2.length > 1) {
str = str + "." + c2[1];
}
var c3 = str.split(".");
if (c3.length > 1) {
var i = decimal - c3[1].length;
for (var j = 0; j < i; j++) {
str += "0";
}
} else {
str += ".";
for (var i = 0; i < decimal; i++) {
str+='0'
}
}
return str;
}
/**
* 千分
* @param str
* @returns {*}
*/
function segmentation(str) {
var length = str.length;
var result = "";
var a = length % 3;
var b = Math.floor(length / 3);
if (a != 0) {
result += str.substring(0, a);
if (b != 0) {
result += ",";
}
}
for (var i = 1; i <= b; i++) {
result += str.substring(a + (i - 1) * 3, a + i * 3);
if (i != b) {
result += ",";
}
}
return result;
}
/**
* 千分位轉數字格式
* @param str
* @returns {string|string}
*/
function toNum(str) {
return String(str).replace(/,/g, '');
}
/**
* 大數據-加
* @param n1
* @param n2
* @returns {string | *}
*/
function bigPlus(n1, n2) {
n1 = toNum(n1);
n2 = toNum(n2);
return new BigNumber(n1).plus(new BigNumber(n2)).toFixed(5)
}
/**
* 大數據-減
*/
function bigMinus(n1, n2) {
n1 = toNum(n1);
n2 = toNum(n2);
return new BigNumber(n1).minus(new BigNumber(n2)).toFixed(5)
}
/**
* 大數據-乘
*/
function bigMultipliedBy(n1, n2) {
n1 = toNum(n1);
n2 = toNum(n2);
return new BigNumber(n1).multipliedBy(new BigNumber(n2)).toFixed(5)
}
/**
* 大數據-除
*/
function bigDividedBy(n1, n2) {
n1 = toNum(n1);
n2 = toNum(n2);
return new BigNumber(n1).dividedBy(new BigNumber(n2)).toFixed(5)
}
其他金額、數值相關js庫(Numeral.js、Math.js、currencyFormatter.js)