<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
TITLE
</title>
<style>
*{
margin:0;
padding:0;
}
#wrap {
margin:auto;
width: 300px;
}
#wrap input[type=text]{
width:30px;
height:20px;
float:left;
text-align:center;
}
</style>
</head>
<body>
<div id="wrap">
<input type="text" id= "tb1"/>
<input type="text" id= "tb2"/>
<input type="text" id= "tb3"/>
<input type="text" id= "tb4"/>
<input type="text" id= "tb5"/>
<input type="text" id= "tb6"/>
</div>
<script type="text/javascript">
onload = function(){
var txts = wrap.getElementsByTagName("input");
for(var i = 0; i<txts.length;i++){
var t = txts[i];
t.setAttribute("maxlength","1 ");
t.index = i;
t.οnkeyup=function(){
var next = this.index + 1;
if(next > txts.length - 1) return;
txts[next].focus();
}
}
};
var idInputObj = document.getElementById("tb6");
//tb6的离焦事件
idInputObj.onblur = function(){
//获取所有input标签
var inputs = wrap.getElementsByTagName("input");
//循环标签
for(var i = 0; i<inputs.length; i++){
//第一个标签
var _input = inputs[i];
//如果是第一位
if( i ==0 ){
if( _input.value == null || _input.value == ""){
_input.value = "";
}
}else{
var before = inputs[i-1].value;
//如果前一位是空
if( before != null && before != "" ){
//如果前一位不是空,填充0
if(_input.value == "" || _input.value == null){
_input.value = 0;
}
}
}
}
};
</script>
</body>
</html>
前面几位空的就空着,从填写数字的那位开始,往后面没有填的就补为0.
可以用于财务的个十百千万。