JS自动给文本框的数字加千分位
2014-09-01 11:48
483 查看
<head><title>Test</title></head>
<body>
<input type="text" id="input_box" value=""/>
<script>
var input_box = document.getElementById("input_box"),
valueBuf,
_valueBuf;
input_box.onblur =function(){
valueBuf =this.value;
_valueBuf = valueBuf.replace(/(\d{3})+$/g, function(){
var args = arguments,
len = args.length,
ret = args[0].match(/(\d{3})/g).join(',');
if(args[0] !== args[len -1]){
ret =','+ ret;
}
return ret;
});
this.value = _valueBuf;
}
input_box.onfocus =function(){
if(valueBuf){
this.value = valueBuf;
}
}
</script>
</body>
</html>
方法二:
<head><title>Test</title>
</head>
<body>
<input type="text" id="input_box" value=""/>
<script>
var input_box = document.getElementById("input_box"),
valueBuf;
window.onload =function(){
input_box.value ='';
}
input_box.onblur =function(){
valueBuf =this.value;
this.value = valueBuf.replace(/\d{3}(?=(?:\d{3})*$)/g, function(){
var args = arguments;
if(args[1] ===0){
return args[0];
}else{
return','+args[0];
}
});
}
input_box.onfocus =function(){
if(valueBuf){
this.value = valueBuf;
}
}
</script>
</body>
</html>
方法三:
<head><title>Test</title></head>
<body>
<input type="text" id="input_box" value=""/>
<script>
var input_box = document.getElementById("input_box");
input_box.onblur =function(){
this.value =this.value.replace(/\d+?(?=(?:\d{3})+$)/g, function(s){
return s +',';
});
}
input_box.onfocus =function(){
this.value =this.value.replace(/,/g, '');
}
</script>
</body>
</html>
方法四: JS千分位处理（包括保留两位小数）
<html>
<head>
<title> JS千分位处理 </title>
</head>
<script>
function $$(id){return document.getElementById(id);}
/**
* 数字格式转换成千分位
*@param{Object}num
*/
function commafy(num) {
//1.先去除空格,判断是否空值和非数
num = num + "";
num = num.replace(/[ ]/g, ""); //去除空格
if (num == "") {
return;
}
if (isNaN(num)){
return;
}
//2.针对是否有小数点，分情况处理
var index = num.indexOf(".");
if (index==-1) {//无小数点
var reg = /(-?\d+)(\d{3})/;
while (reg.test(num)) {
num = num.replace(reg, "$1,$2");
}
} else {
//这里要求保留两位小数
num = new Number(num).toFixed(2);
var intPart = num.substring(0, index);
var pointPart = num.substring(index + 1, num.length);
var reg = /(-?\d+)(\d{3})/;
while (reg.test(intPart)) {
intPart = intPart.replace(reg, "$1,$2");
}
num = intPart +"."+ pointPart;
}
return num;
}
/**
* 去除千分位
*@param{Object}num
*/
function delcommafy(num){
num = num.replace(/[ ]/g, "");//去除空格
num=num.replace(/,/gi,'');
return num;
}
function doit1(val){
if(val.indexOf(",")>-1){
var t = delcommafy(val);
$$("tx").value = t;
}
}
function doit2 (val){
var t = commafy(val);
$$("tx").value = t;
}
</script>
<body>
<input type="text" name="tx" id="tx" onfocus="doit1(this.value)" onblur="doit2(this.value)" value=""/>
</body>
</html>
<body>
<input type="text" id="input_box" value=""/>
<script>
var input_box = document.getElementById("input_box"),
valueBuf,
_valueBuf;
input_box.onblur =function(){
valueBuf =this.value;
_valueBuf = valueBuf.replace(/(\d{3})+$/g, function(){
var args = arguments,
len = args.length,
ret = args[0].match(/(\d{3})/g).join(',');
if(args[0] !== args[len -1]){
ret =','+ ret;
}
return ret;
});
this.value = _valueBuf;
}
input_box.onfocus =function(){
if(valueBuf){
this.value = valueBuf;
}
}
</script>
</body>
</html>
方法二:
<head><title>Test</title>
</head>
<body>
<input type="text" id="input_box" value=""/>
<script>
var input_box = document.getElementById("input_box"),
valueBuf;
window.onload =function(){
input_box.value ='';
}
input_box.onblur =function(){
valueBuf =this.value;
this.value = valueBuf.replace(/\d{3}(?=(?:\d{3})*$)/g, function(){
var args = arguments;
if(args[1] ===0){
return args[0];
}else{
return','+args[0];
}
});
}
input_box.onfocus =function(){
if(valueBuf){
this.value = valueBuf;
}
}
</script>
</body>
</html>
方法三:
<head><title>Test</title></head>
<body>
<input type="text" id="input_box" value=""/>
<script>
var input_box = document.getElementById("input_box");
input_box.onblur =function(){
this.value =this.value.replace(/\d+?(?=(?:\d{3})+$)/g, function(s){
return s +',';
});
}
input_box.onfocus =function(){
this.value =this.value.replace(/,/g, '');
}
</script>
</body>
</html>
方法四: JS千分位处理（包括保留两位小数）
<html>
<head>
<title> JS千分位处理 </title>
</head>
<script>
function $$(id){return document.getElementById(id);}
/**
* 数字格式转换成千分位
*@param{Object}num
*/
function commafy(num) {
//1.先去除空格,判断是否空值和非数
num = num + "";
num = num.replace(/[ ]/g, ""); //去除空格
if (num == "") {
return;
}
if (isNaN(num)){
return;
}
//2.针对是否有小数点，分情况处理
var index = num.indexOf(".");
if (index==-1) {//无小数点
var reg = /(-?\d+)(\d{3})/;
while (reg.test(num)) {
num = num.replace(reg, "$1,$2");
}
} else {
//这里要求保留两位小数
num = new Number(num).toFixed(2);
var intPart = num.substring(0, index);
var pointPart = num.substring(index + 1, num.length);
var reg = /(-?\d+)(\d{3})/;
while (reg.test(intPart)) {
intPart = intPart.replace(reg, "$1,$2");
}
num = intPart +"."+ pointPart;
}
return num;
}
/**
* 去除千分位
*@param{Object}num
*/
function delcommafy(num){
num = num.replace(/[ ]/g, "");//去除空格
num=num.replace(/,/gi,'');
return num;
}
function doit1(val){
if(val.indexOf(",")>-1){
var t = delcommafy(val);
$$("tx").value = t;
}
}
function doit2 (val){
var t = commafy(val);
$$("tx").value = t;
}
</script>
<body>
<input type="text" name="tx" id="tx" onfocus="doit1(this.value)" onblur="doit2(this.value)" value=""/>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- JQ、JS 自动给文本框的数字加千分位(带format-number插件)
- JS 文本框中只允许输入数字
- javascript之文本框输入四个数字自动加空格的脚本
- JS 控制文本框只能输入数字
- 一个js日期选择器。当光标移到文本框时。自动会在文本框的底部显示出来。
- js控制文本框只能输入数字（C#...Web）
- 用JS限制文本框只能输入数字时的正则表达式问题！
- js正则表达式限制文本框只能输入数字,小数点,英文字母
- javascript---文本框自动验证数字和日期
- js 只能输入数字和小数点的文本框改进版
- js实现层关闭/文本框2的值随文本框1内数字变化
- javascript之文本框输入四个数字自动加空格的脚本
- js数字千分位及取小数点后几位方法测试
- 用js控制文本框只能输入数字
- JS判断文本框输入是否为数字
- js实现文本框只能输入数字
- js控制文本框只能输入数字 及 常用字符对应ASCII码值
- JS 限制文本框只能输入数字
- js正则表达式限制文本框只能输入数字,小数点,英文字母,汉字等各类代码
- js控制文本框只能输入数字 及 常用字符对应ASCII码值