格式化金额输出

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
    function checkNum()
    {
var text = "" ;
        var num=document.getElementById("MyInput").value;
        if (0==num.length)
            return;
        var strArr=num.split('.');
if(strArr.length == 1){
text = num + ".00" ;
}else if(strArr.length == 2){
if(strArr[1].length == 1){
text = strArr[0] +"."+strArr[1]+"0" ;
}else if(strArr[1].length == 2){
text = strArr[0] +"."+strArr[1];
}else{
alert("输入不正确");
}

}else{
alert("输入不正确");
}

      //  alert(text);
        document.getElementById("MyInput").value = text;
    }
</script>
</head><body>
<font color="#FFFFFF" size="6" face="楷体_GB2312" id="Input">
<input  style="font-size: 24pt;text-align: center;" type="text" size="20" name="MyInput"  id="MyInput" onblur="checkNum()">
</font></body>
</html>
在失去焦点时执行函数

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<font color="#FFFFFF" size="6" face="楷体_GB2312" id="Input"><input style="font-size: 24pt; text-align: center;" type="text" size="20" name="MyInput" id='MyInput' ></font> <script type="text/javascript">

function checkNum(){

}
function doNum() {
var num = document.getElementById("MyInput").value;
if (num == 0)
return;
var pos = num.indexOf('.');
if (pos == -1){
num = num + ".00";
}if(pos == 0){
num = "0"+num.slice(0,3);
}
document.getElementById("MyInput").value = num;
}
var initF = false;
var time ;
function initFocus(){
initF = true;
document.addEventListener('keyup',doKeyup);
document.addEventListener('keydown',doKeydown);
}
function doKeydown(){
clearTimeout(time);
}
function doKeyup(){
time = setTimeout(doNum,600);

}
function clearblur(){
if(initF){
initF = false;
document.removeEventListener('keyup');
document.removeEventListener('keydown');
}

}

var $a = document.getElementById('MyInput');
$a.addEventListener('focus',initFocus);
$a.addEventListener('blur',clearblur);

</script>
</body>
</html>

非常感谢楼上，不过还有个问题，就是name="MyInput" onPropertyChange="checkNum()这条语句，就是如果MyInput有变化，就调用checkNum()函数，但是在checkNum()函数里又设置了MyInput的值，所以又导致MyInput有变化，接着checkNum()函数又被触发。结果就是导致死循环，堆栈溢出。

解决了，其实判断如果值没改变就不改变MyInput的值就好了

<body>
<input type = "text" id = "aa"><input id = "aaa" type = "hidden" value = "">
</body>
<script>document.getElementById("aa").onkeyup = checkinput;
function checkinput(e){
e = e || window.event;
var inputnum = e.keyCode || e.which,
hiddenInput = document.getElementById("aaa"),
currentNum = hiddenInput.value,
showInput = this.value,
arr = [];
console.log(inputnum);
if(inputnum == 8){
//进行删除时，对应的隐藏的input的值，做出变化
hiddenInput.value = currentNum.substring(0,currentNum.length-1);
this.value = hiddenInput.value;
}else if(currentNum == "" && inputnum == 48){
//首先为空时，输入0时，这么处理。
this.value = "";
return;
}else if(currentNum == "" && inputnum == 190){
//为空时，输入“.”，这么处理。
this.value = "0.";
hiddenInput.value = "0.";
}else if(currentNum == "" && inputnum > 48 && inputnum < 58){
//为空时，输入非零数字，这么处理
this.value = showInput + ".00";
hiddenInput.value = showInput;
}else if(currentNum != "" && inputnum == 190){
//不为空时，输入“.”，这么处理
if(currentNum.indexOf(".") != -1){
//检测隐藏的input是否有"."，有的话，这么处理，
this.value = showInput.substring(0,showInput.length-1);
}else{
//隐藏的input没有输入国"."，这么处理
hiddenInput.value = hiddenInput.value + ".";
this.value = hiddenInput.value;
}

}else if(currentNum != "" && inputnum > 48 && inputnum < 58){
//不为空时，输入为数字，这么处理
if(currentNum.indexOf(".") != -1){
//检测隐藏的input是否有"."，有的话，这么处理，
arr = currentNum.split(".");
if(arr[1].length>=2){
hiddenInput.value = arr[0]+"."+arr[1].substring(0,2);
this.value = hiddenInput.value;
}else{
hiddenInput.value = currentNum + String.fromCharCode(inputnum);
this.value = hiddenInput.value;
}
}else{
//隐藏的input没有输入国"."，这么处理
hiddenInput.value = hiddenInput.value + String.fromCharCode(inputnum);
this.value = hiddenInput.value + ".00";
}
}else if(inputnum != 190 && (inputnum < 48 || inputnum > 57)){
//其他输入时，为了防止输入为非数字，这么处理。
this.value = showInput.replace(/[^\d\.]/g,"");
}
}
</script>
</html>我总是写的有些复杂。并且添加了一个隐藏的input，用来记录输入的真是内容。
后来想想，这个input其实只用来记录用户是否输入过' . '就可以了

调试易

格式化金额输出

解决方案 »