如何让一个输入框的值等于另两个输入框值得和？

本帖最后由 ora_shq 于 2010-06-28 17:06:55 编辑

解决方案 »

  1.   

    不知道是不是你想要的
    <!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>
    </head><body>
    <div id="cj">
    <p><label for="cj1">成绩1</label></label><input name="" type="text" id="cj1" maxlength="2"/></p>
      <p><label for="cj2">成绩2</label></label><input name="" type="text" id="cj2"  maxlength="2"/></p>
      <p><label for="cj3">成绩3</label></label><input name="cj" type="text" id="cj3"  maxlength="2"/></p>
      <p><label for="cj4">成绩4</label></label><input name="" type="text" id="cj4"  maxlength="3" readonly="readonly"/></p>
    </div>
    <script type="text/javascript">
    (function(){
    function $(id){ return document.getElementById(id)};
    function getCj(obj){
    obj.onkeyup = function(){
    var value1 = Number($('cj1').value,10) || 0;
    var value2 = Number($('cj2').value,10) || 0;
    var value3 = Number($('cj3').value,10) || 0;
    $('cj4').value = value1 + value2 -value3
    }
    }
    getCj($('cj1'));
    getCj($('cj2'));
    getCj($('cj3'));
    })();
    </script>
    </body>
    </html>
      

  2.   

    如果输入内容只是以上几个的话：function ChengJiInput(type){
    var cj1=document.getElementById("TextBox_83_成绩1").value;
    var cj2=document.getElementById("TextBox_83_成绩2").value;
    var cj3=document.getElementById("TextBox_83_成绩3").value;
    var objCJ4=document.getElementById("TextBox_83_成绩4");
    objCJ4.value=cj1+cj2-cj3;
    }
    //判断小数的方法
    function CheckNumber(s)
    {
    var reg = /^[0-9]+\.?[0-9]{0,2}$/;
    return Check(reg,s);
    }function Check(reg,str)
    {
    if( reg.test(str))
    {
    return true;
    }
    return false;
    }
      

  3.   

    <input type="text" name="" id="" onpropertitychange="checkNum(this);ChengJiInput();">
    function ChengJiInput(){
        var cj1 = document.getElementById("TextBox_83_成绩1").value;
        var cj2 = document.getElementById("TextBox_83_成绩2").value;
        var cj3 = document.getElementById("TextBox_83_成绩3").value;
        cj1=cj1.length>0?cj1*1:0;
        cj2=cj2.length>0?cj2*1:0;
        cj3=cj3.length>0?cj3*1:0;
        document.getElementById("TextBox_83_成绩4").value=cj1+cj2-cj3;
    }验证方法
    function checkNum(obj){
      //obj 要检验的输入框
       var val = obj.value;
      var reg = /(^\d{1,11})|(\.{1}\d{0,2}$)/g,  //表示整数或最多两位小数的数字
      obj.style.color="black"; 
      if(val.replace(reg,'')!=''){
        obj.style.color="red";
        alert("成绩格式输入有误,以红色标出!");
       return;
     }
    }
      

  4.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
    <title></title>
    <script language="JavaScript" type="text/javascript"> function chengJiInput(obj){
       var re = /\d*\.\d{2}/;
       var chengji = obj.value;
       if(!re.test(chengji)){
         alert("你输入的格式不对");
       }else{
         var chengji1 = document.getElementById("text1").value;
         var chengji2 = document.getElementById("text2").value;
         var chengji3 = document.getElementById("text3").value;
         var chengji4 = document.getElementById("text4");
     chengji4.value = parseInt(chengji1)+parseInt(chengji2)-parseInt(chengji3);
       }
     }
    </script></head>
    <body>
    <td>
        <input name="TextBox_83_成绩1" type="text" maxlength="10" id="text1"
    style="width:50px;" onblur="chengJiInput(this)" />
    </td>
    <td>
        <input name="TextBox_83_成绩2" type="text" maxlength="10" id="text2"  style="width:50px;"  onblur="chengJiInput(this)"/>
    </td>
    <td>
        <input name="TextBox_83_成绩3" type="text" maxlength="10" id="text3"  style="width:50px;" onblur="chengJiInput(this)"/>
    </td>
    <td><input name="TextBox_83_成绩4" type="text" maxlength="10" id="text4" style="width:50px;" />
    </td>
    </body>
    </html>