输入数字，鼠标离开焦点，整数部分千分格式化。

最新推荐文章于 2024-10-17 16:24:27 发布

原创最新推荐文章于 2024-10-17 16:24:27 发布 · 456 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#H5千分格式化金额

本文介绍了一个简单的HTML页面，该页面使用JavaScript实现当用户输入金额时，自动格式化数字的功能。具体来说，它会在每三位数字间插入逗号，以便于阅读，并保留小数点后的数字不变。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		请输入金额:<input type="number" id="in" onblur="fn()"/>
		<script type="text/javascript">
			var flag=false;
			function fn(){
				var inp = document.getElementById("in").value;
				var arr=inp.split("");
				var result=[];
				var temp=arr.length-1;
				var counter=0;
				//判断是否含有小数点
				for(var j=arr.length-1; j>=0;j--){
					if(arr[j]=="."){
						temp=j-1;
					}
				}
				//alert(temp);
				//格式化数字
			    for(var i=temp;i>=0;i--){
			    	counter++;
			    	result.unshift(arr[i]);         
			    	if(!(counter%3)&&i!=0){
			    		result.unshift(",");
			    	}
			    }
			    //追加小数点后面元素
			    for(var i=temp+1;i<arr.length-1;i++){
			    	result.push(arr[i]); 
			    }
			   
			   //输出并设置不在改变
			    if(!flag){
			    	document.getElementById("in").type="text";
					document.getElementById("in").value = result.join("");
					flag=true;
			    }
				 	
			}
		</script>
	</body>
</html>