如何实现行或者列中 文本框中整数值的累加

<table width="80%" border="1" align="center" id="test">
  <tr>
    <td width="69">列值</td>
<td width="69">整数一</td>
    <td width="69">整数二</td>
    <td width="54">总和</td>
  </tr>
  <tr>
  <td>1</td>
    <td><label>
      <input type="text" name="textfield">
    </label></td>
    <td><input type="text" name="textfield3"></td>
    <td><input type="text" name="textfield5"></td>
  </tr>
  <tr>
    <td>2</td>
    <td><input type="text" name="textfield2"></td>
    <td><input type="text" name="textfield4"></td>
<td><input type="text" name="textfield6"></td>
  </tr>
    <tr>
    <td>合计</td>
    <td><input type="text" name="textfield2"></td>
    <td><input type="text" name="textfield4"></td>
<td><input type="text" name="textfield6"></td>
  </tr>
</table>如何用js实现行和列后面的总和，谢谢各位！！

解决方案 »

  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" >
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <head>
    <title>无标题页</title>
    <style type="text/css"></style>
    <script src="jquery-1.3.2.js"></script>  
    <script type="text/javascript">
    $(document).ready(function(){
        var value1 = $("table tr:eq(1) td:eq(1) input").val();
    var value2 = 
    alert(value1)
    $(".test1").blur(function(){
    var value1 = $(this).val();
        var value2 = $(this).parent().next().children("input").val();
    var value = parseInt(value1)+ parseInt(value2);
    $(this).parent().next().next().children("input").attr("value",value);
    var value_next1 = $(this).parent().parent().next().children(":eq(1)").children("input").val();
    alert(parseInt(value_next1))
    var value_next =  parseInt(value1) + parseInt(value_next1);
    $(".test4:eq(0)").attr("value",value_next);
    });
    });
    </script></head>
    <body>
    <table width="80%" border="1" align="center" id="test">
      <tr>
          <td width="69">列值</td>
          <td width="69">整数一</td>
          <td width="69">整数二</td>
          <td width="54">总和</td>
      </tr>
      <tr>
          <td>1</td>
          <td><input class="test1" type="text" name="textfield"></td>
          <td><input class="test2" type="text" name="textfield3"></td>
          <td><input class="test3" type="text" name="textfield5"></td>
      </tr>
      <tr>
          <td>2</td>
          <td ><input class="test1" type="text" name="textfield2"></td>
          <td><input class="test2" type="text" name="textfield4"></td>
          <td><input class="test3" type="text" name="textfield6"></td>
      </tr>
      <tr>
          <td>合计</td>
          <td><input class="test4" type="text" name="textfield2"></td>
          <td><input class="test4" type="text" name="textfield4"></td>
          <td><input class="test5" type="text" name="textfield6"></td>
      </tr>
    </table></body>
    </html>
    我只做了第一个输入框的处理，楼主太麻烦了，我建议写id，原理是一样的
      

  2.   

    这个不行啊，我要用JavaScript实现啊 ，你用的是jquery
      

  3.   

    <table width="80%" border="1" align="center" id="test">
      <tr>
      <td width="69">列值</td>
      <td width="69">整数一</td>
      <td width="69">整数二</td>
      <td width="54">总和</td>
      </tr>
      <tr>
      <td>1</td>
      <td><input type="text" name="textfield"></td>
      <td><input type="text" name="textfield3"></td>
      <td><input type="text" name="textfield5"></td>
      </tr>
      <tr>
      <td>2</td>
      <td><input type="text" name="textfield2"></td>
      <td><input type="text" name="textfield4"></td>
    <td><input type="text" name="textfield6"></td>
      </tr>
      <tr>
      <td>合计</td>
      <td><input type="text" name="textfield2"></td>
      <td><input type="text" name="textfield4"></td>
    <td><input type="text" name="textfield6"></td>
      </tr>
    </table>
    <script>
    var param=0;
    window.onload=function(){
        var obj=document.getElementById("test");
        for(var i=1;i<obj.rows.length-1;i++){
            var row=obj.rows[i];
            row.cells[1].childNodes[0].onfocus=
            row.cells[2].childNodes[0].onfocus=function(){param=parseInt(this.value||0);}
            row.cells[1].childNodes[0].onchange=function(){
                var curr=this.parentNode.parentNode.cells[3].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
                
                curr=obj.rows[obj.rows.length-1].cells[1].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
                
                curr=obj.rows[obj.rows.length-1].cells[3].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
            };
            row.cells[2].childNodes[0].onchange=function(){
                var curr=this.parentNode.parentNode.cells[3].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
                
                curr=obj.rows[obj.rows.length-1].cells[2].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
                
                curr=obj.rows[obj.rows.length-1].cells[3].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
            };
            
        }
    }
    </script>
      

  4.   

    <table width="80%" border="1" align="center" id="test">
      <tr>
      <td width="69">列值</td>
      <td width="69">整数一</td>
      <td width="69">整数二</td>
      <td width="54">总和</td>
      </tr>
      <tr>
      <td>1</td>
      <td><input type="text" name="textfield"></td>
      <td><input type="text" name="textfield3"></td>
      <td><input type="text" name="textfield5"></td>
      </tr>
      <tr>
      <td>2</td>
      <td><input type="text" name="textfield2"></td>
      <td><input type="text" name="textfield4"></td>
    <td><input type="text" name="textfield6"></td>
      </tr>
      <tr>
      <td>合计</td>
      <td><input type="text" name="textfield2"></td>
      <td><input type="text" name="textfield4"></td>
    <td><input type="text" name="textfield6"></td>
      </tr>
    </table>
    <script>
    var param=0;//変更前
    var col=0;  //列No
    window.onload=function(){
        var obj=document.getElementById("test");
        for(var i=1;i<obj.rows.length-1;i++){
            var row=obj.rows[i];
            row.cells[1].childNodes[0].onfocus=
            row.cells[2].childNodes[0].onfocus=function(){
                param=parseInt(this.value||0);
                col=isNaN(this.parentNode.previousSibling.innerHTML)?2:1;
            }
            row.cells[1].childNodes[0].onchange=
            row.cells[2].childNodes[0].onchange=function(){
                var curr=this.parentNode.parentNode.cells[3].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
                
                curr=obj.rows[obj.rows.length-1].cells[col].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
                
                curr=obj.rows[obj.rows.length-1].cells[3].childNodes[0];
                curr.value=parseInt(curr.value||0)+parseInt(this.value||0)-param;
            };
            
        }
    }
    </script>
      

  5.   


    <table width="80%" border="1" align="center" id="test">
      <tr>
    <td width="69">列值</td>
    <td width="69">整数一</td>
    <td width="69">整数二</td>
    <td width="54">总和</td>
      </tr>
      <tr>
    <td>1</td>
    <td><input type="text" name="textfield" onchange="count(this)"></td>
    <td><input type="text" name="textfield3" onchange="count(this)"></td>
    <td><input type="text" name="textfield5" disabled></td>
      </tr>
      <tr>
    <td>2</td>
    <td><input type="text" name="textfield2" onchange="count(this)"></td>
    <td><input type="text" name="textfield4" onchange="count(this)"></td>
    <td><input type="text" name="textfield6"disabled></td>
      </tr>
      <tr>
    <td>合计</td>
    <td><input type="text" name="textfield2" disabled></td>
    <td><input type="text" name="textfield4" disabled></td>
    <td><input type="text" name="textfield6" disabled></td>
      </tr>
    </table>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function count(inp) {
    //算总和
    var trObj = inp.parentElement.parentElement;
    var sum = 0;
    for (var i=1; i<trObj.children.length-1; i++) //循环input所在行的单元格（除去第一格和最后一格）
    {
    sum += trObj.childNodes[i].firstChild.value ? parseInt(trObj.childNodes[i].firstChild.value,10) : 0; //如果input值为空，则算作0
    }
    trObj.childNodes[trObj.children.length-1].firstChild.value = sum; //给最后一格内的input赋值
    //算合计
    var tab = document.getElementById("test");
    for (var i=1; i<tab.rows[0].cells.length; i++) //循环列（除去第一列和最后一列）
    {
    var total = 0;
    for (var j=1; j<tab.rows.length-1; j++) //循环行（除去第一行和最后一行）
    {
    total += tab.rows[j].cells[i].firstChild.value ? parseInt(tab.rows[j].cells[i].firstChild.value,10) : 0; //如果input值为空，则算作0
    }
    tab.rows[tab.rows.length-1].cells[i].firstChild.value = total; //给每列最下面一行的input赋值
    }
    }
    //-->
    </SCRIPT>
      

  6.   

    因为行数太多，用JavaScript如何实现遍历第二行，而且使序列好递增，麻烦各位了
      

  7.   

    你是要得到这种效果吗？
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head></head><body>
    <table border="1" align="center" id="test">
      <tr>
      <td width="69">列值</td>
      <td width="69">整数一</td>
      <td width="69">整数二</td>
      <td width="54">总和</td>
      </tr>
      <tr>
      <td>1</td>
      <td><input type="text" name="aa" value="13"></td>
      <td><input type="text" name="bb" value="10"></td>
      <td><input type="text" name="cc"></td>
      </tr>
      <tr>
      <td>2</td>
      <td><input type="text" name="aa" value="123"></td>
      <td><input type="text" name="bb" value="1"></td>
      <td><input type="text" name="cc"></td>
      </tr>
      <tr>
      <td>3</td>
      <td><input type="text" name="aa" value="12"></td>
      <td><input type="text" name="bb" value="10"></td>
      <td><input type="text" name="cc"></td>
      </tr>
      <tr>
      <td>4</td>
      <td><input type="text" name="aa" value="13"></td>
      <td><input type="text" name="bb" value="107"></td>
      <td><input type="text" name="cc"></td>
      </tr>
      <tr>
      <td>5</td>
      <td><input type="text" name="aa" value="123"></td>
      <td><input type="text" name="bb" value="100"></td>
      <td><input type="text" name="cc"></td>
      </tr>
      <tr>
      <td>6</td>
      <td><input type="text" name="aa" value="23"></td>
      <td><input type="text" name="bb" value="1"></td>
      <td><input type="text" name="cc"></td>
      </tr>
      <tr>
      <td>合计</td>
      <td><input type="text" name="sum1" id="sumA"></td>
      <td><input type="text" name="sum2" id="sumB"></td>
    <td><input type="text" name="sum" id="sum"><input type="button" value="求和" onclick="xx(this)"></td>
      </tr>
    </table><script language="javascript">
    function xx(){
    var aa = document.getElementsByName("aa");
    var bb = document.getElementsByName("bb");
    var cc = document.getElementsByName("cc");
    var sumA=0;
    var sumB=0;
    var sum=0;
    for(var i=0;i<aa.length;i++){
    cc[i].value=parseFloat(aa[i].value)+parseFloat(bb[i].value);
    sumA+=parseFloat(aa[i].value);
    sumB+=parseFloat(bb[i].value);
    sum+=sumA+sumB;
    }
    document.getElementById("sumA").value=sumA;
    document.getElementById("sumB").value=sumB;
    document.getElementById("sum").value=sumA+sumB;
    }
    </script>
    </body></html>