个人观点:
<html>
<head>
<style type="text/css">
td {text-align:center;background-color:#C0C0C0;}
input {text-align:center}
.biaoge { width:1800px;height:1000px;padding-top:60px;padding-left:130px;background-color:#989898;}
input:focus{background-color:#FFFFCC;}
</style>
<script type="text/javascript">
function IntValueCheck(input)
{
//①这里,你得到相应对象的value
var value = input.value;
//②因为你的number1,2都调用这个方法,而对1,2的值的要求不一(1,为整数;2,为整数或小数),所以必须判断是1,还是2
if(input.id == 'number1'){
//调用验证number1的方法
if(!validateNumber1(value))return;
}
if(input.id == 'number2'){
//调用验证number2的方法
if(!validateNumber2(value))return;
}
//这里你要根据number1,2的值,自动计算结果,输出到number3(ps:不知是不是你要表达的意思)
method();
}
//运算
function method(){
//分别获取number1,2的值
var number1value = document.getElementById("number1").value;
var number2value = document.getElementById("number2").value;
//判断都不为空
if(!(number1value.match(/^\s*$/) || number2value.match(/^\s*$/))){
//js中,由于整数*小数,会得不到正确的值,则处理成如下:
//如果number2为小数,则根据小数点拆分成两个整数,处理如:
//10 * 10.23 = 10*10 + 10*23/100(小学数学)
//除以10的倍数,不会有精度差
var fvList = number2value.split(/[.]/);
//存储放进number3的值
var v;
//number2为整数
if(fvList.length==1)v = number1value*Number(fvList[0]);
//number2为小数
if(fvList.length==2)v = (number1value*Number(fvList[0])+number1value*Number(fvList[1])/Math.pow(10,(""+fvList[1]).length));
document.getElementById("number3").value = v;
}
}
//验证number1
function validateNumber1(value){
var flag = true;
//对于number1,必须为整数,一般这种验证都用正则表达式
var reg = /^\s*([0]|[1-9]\d*)?\s*$/;//这个正则表示的是:①一个整数,前后可以存在空格②为空。
if(!value.match(reg)){
alert("number1必须为整数");
flag = false;
}
return flag;
}
//验证number2
function validateNumber2(value){
var flag = true;
//对于number2,可为整数,可为小数
var reg = /^\s*(([0]|[1-9]\d*)([.]\d+)?)?\s*$/;//这个正则表示的是:①一个整数或小数,前后可以存在空格②为空。
if(!value.match(reg)){
alert("number2必须为整数或小数");
flag = false;
}
return flag;
}
</script>
</head>
<body >
<div class="biaoge">
<table
border="1" cellspacing="8"
>
<h1 style ="color:red">最好学习下正则表达式,<br>方便验证操作字符串等!<br>以上只是个人意见,希望楼主和楼下的人批评指正</h1>
<tr>
<td><input id="number1" type="text"
onblur="IntValueCheck(this);" /></td>
<td><input id="number2" type="text" size="10px" onblur="IntValueCheck(this);"/></td>
<td><input id="number3" type="text" readonly size="10px" /></td>
</tr>
</table>
</div>
</body>
</html>