javascript - 如何用javascript对多个(未定义的数字)文本框的数字求和？

Question

我正在使用 php 和 html 创建一个表，其中包含数据库中的值，表的字段是文本字段。第一列中的所有文本字段都具有相同的名称，第二列中的所有文本字段都具有相同的名称...等等。

在前 5 列之后有一个空列，我应该在其中显示该行中前 5 个文本字段的总和。所有的行都是不同的形式。我不知道如何做到这一点，我什至不知道是否有一种通过表单选择文本字段的简单方法，所以任何帮助都会很棒。

前 5 个文本字段的总和应该出现在该空列中，并且当任何文本框值发生更改时，应该触发 javascript 函数。如果有人知道如何做到这一点，那就太好了。

如果您想查看表创建代码:

<?php 
$arrayida=array(0);
$arrayidp=array(0);
$host="localhost"; // Host name 
$username="root"; // Mysql username 
$password=""; // Mysql password 
$db_name="3Ciclo"; // Database name 
 // Table name 

// Connect to server and select database.
mysql_connect("$host", "$username", "$password") or die("cannot connect"); 
mysql_select_db("$db_name") or die("Cannot select Database.");


                    $queryida="SELECT * FROM areas where tipo='AE' or tipo='C'";
                    $resultida=mysql_query($queryida);
                    while($b = mysql_fetch_array($resultida))
                    {   
                        $ida=$b["ida"];
                        if (in_array ($ida , $arrayida ))
                        {

                        }else{
                                $arrayida[]=$ida;
                                /*while($b = mysql_fetch_array($resultida))
                                {
                                    ?>
                                    <td> <?php echo $ida." - ".$b['nome']; ?> </td>
                                    <?php 
                                }*/

                        }
                    }



sort($arrayida);
//print_r($arrayida);
foreach ($arrayida as $key => $val) 
{   


    if($key <> 0)
    {
        if ($key == 5){
            $prev=$val;
            $queryida="SELECT * FROM areas where ida=".$val;
            $resultida=mysql_query($queryida);
            while($b = mysql_fetch_array($resultida))
            {

                $nome=$b["nome"];
                $idz=$b["ida"];
            ?> <td style="font-size:9px"> <?php echo "$nome"; ?> </td> <td style="background-color:#FFF"> </td> <?php 
            }

        }else
            {
                $queryida="SELECT * FROM areas where ida=".$val;
                $resultida=mysql_query($queryida);
                while($b = mysql_fetch_array($resultida))
                {
                    $nome=$b["nome"];
                    $idz=$b["ida"];
                ?> <td style="font-size:9px"> <?php echo "$nome"; ?> </td> <?php 
                }
            }




    }
}

 ///////////////////////////////////////////////////////


$sql="SELECT * FROM relacoes as a inner join areas as b on a.ida=b.ida where b.tipo='AE' or b.tipo='C'";
$resultrelacoes=mysql_query($sql);
$count=mysql_num_rows($resultrelacoes) + 1;

while ($r = mysql_fetch_array($resultrelacoes))
{                   

                    $idp=$r["idp"];
                    $queryidp="SELECT * FROM profissoes where idp=".$idp;
                    $resultidp=mysql_query($queryidp);
                    $idacheck=$r["ida"];
                        if (in_array ($idp , $arrayidp ) )
                            {

                                    $x=array_search($idacheck, $arrayida);  
                                    $res=$x - $xpast;
                                    $a= 5-$xpast;
                                    for ($i=1;$i<=$res;$i++)
                                    {
                                        $pos=$arrayida[$xpast + $i];
                                        /*echo "<script type='text/javascript'>alert('{$pos}');</script>";*/
                                            if($i <> $res )
                                            {
                                                ?><td><input type="text" name="<?php echo $pos  ?>" id="<?php echo $pos ?>" style="width:40px"  /> </td> <?php
                                            }else
                                            {
                                                ?><td><input type="text" name="<?php echo $pos  ?>" id="<?php echo $pos  ?>" value="<?php echo $r["percentagem"]; ?>" style="width:40px"  /> </td> <?php
                                            }
                                            if ($i==$a){
                                                ?><td> </td> <?php
                                            }

                                    }
                            }else{

                                $arrayidp[]=$idp;
                                while($b = mysql_fetch_array($resultidp))
                                {
                                    if (array_search($idp,$arrayidp)<>1)
                                    {
                                        $a= 5-$xpast;
                                        $max = sizeof($arrayida);
                                        for ($i=1;$i<=$max - $xpast - 1;$i++)
                                        {   
                                            $pos=$arrayida[$xpast + $i];
                                                ?> <td><input type="text" name="<?php echo $pos  ?>" id="<?php echo $pos  ?>" style="width:40px" /> </td> <?php
                                            if($i==$a){
                                            ?> <td> </td> <?php
                                            }
                                            if($i==($max-$xpast-1)){
                                                ?> <td><input onclick="soma()" type="submit"  /></td> <?php
                                            } 
                                        }
                                    }
                                    ?></form > </tr> <form id="1" ACTION="http://www.cs.tut.fi/cgi-bin/run/~jkorpela/echo.cgi"
METHOD="POST"> <tr> <td style="font-size:9px;"> <?php echo $b['nome']; ?> </td> 
                                    <?php 
                                    $idacheck=$r["ida"] ;
                                    $x=array_search($idacheck, $arrayida);  
                                    for ($i=1;$i<=$x;$i++)
                                    {
                                        $pos=$i;
                                        if($i <> $x)
                                        {                                       
                                            if ($i==5){
                                                ?> <td><input type="text" name="<?php echo $pos  ?>" id="<?php echo $pos  ?>" style="width:40px" /> </td> <td></td><?php
                                            }else{
                                                ?> <td><input type="text" name="<?php echo $pos  ?>" id="<?php echo $pos  ?>" style="width:40px" /> </td> <?php
                                            }

                                        }else
                                        {
                                            ?><td><input type="text" name="<?php echo $pos  ?>" id="<?php echo $pos  ?>" value="<?php echo $r["percentagem"]; ?>" style="width:40px" />  </td> <?php

                                        }

                                    }

                                }
                        }


                    $xpast=$x;

}
$a= 5-$xpast;
$max = sizeof($arrayida);
for ($i=1;$i<=$max - $xpast - 1;$i++){

?> <td><input type="text" name="textfield" id="textfield" style="width:40px" /> </td> <?php
if($i==$a){
        ?> <td> </td> <?php
}
if($i==($max-$xpast-1)){
        ?> <td><input type="submit"  /></td> <?php
} 
}

//FIM DA 1ª TABELA ///////////////////////////////////////////////////////  ?>`

Answer 1

我得到了你想要的要点，并且没有使用你使用过的相同的东西，但是如果你根据需要/期望调整它，这会让你到达那里:

 //.sumcolumn - the class of the column you want the sum to be in.
 //#tableid - id of table you have all this in

$('#tableid').on('load',function(){
    for(var i=0; i<$('tableid').find('tr').length; i++){
        var sum = parseInt($('#tableid tr').eq(i).children().eq(0).children('input').val());
        sum += parseInt($('#tableid tr').eq(i).children().eq(1).children('input').val());
        sum += parseInt($('#tableid tr').eq(i).children().eq(2).children('input').val());
        sum += parseInt($('#tableid tr').eq(i).children().eq(3).children('input').val());
        sum += parseInt($('#tableid tr').eq(i).children().eq(4).children('input').val());
        $('#tableid tr').eq(i).find('.sumcolumn').text(sum);
    }
});

这是草率、臃肿、临时起意的代码，但还有更好的方法。但这确实有效。如果你有 jQuery。