如何用 javascript 添加 n 个输入值

Question

朋友们，我想要我在字段中输入的数字的总和以及这些输入值的总和等于我的总值。它显示 Nan 错误当我添加这些输入值时请帮助

This is my body Content

    <form action="" method="post">
    <input type="text" name="cnum" placeholder="enter no. of input">
    <input type="submit" name="submit" >
    </form>
    <?php
    if(isset($_POST['cnum']))
    {
        $cnum=$_POST['cnum'];
        $i=0;
        ?>
    <form action="" method="post">
        <input type="hidden" name="total" id="total" value="10">
        <input type="hidden" name="cnum" id="cnum" value="<?php echo $cnum ;?>">
        <?php
        while($i<$cnum)
        {
            ?>
                <input type="number" id="aq<?php echo $i; ?>" onKeyup="add()" name="aq<?php echo $i; ?>"><br />
            <?php
            $i++;
        }
    ?>
        <input type="submit" name="aqsub">
    </form>
    <?php
    }
    ?>

This is my java script function

var val=0;
var total=document.getElementById('total').value;
var cnum=document.getElementById('cnum').value;
var anum;
function add()
{
var n=0;
while(n<cnum)
{
    anum = 0;
    if(document.getElementById('aq'+n).value != "")        {            
            anum=parseInt(document.getElementById('aq'+n).value);
        }
    val += anum;
    n++;
}
alert(val);

}

Answer 1

在您的 javascript

中添加以下代码

cnum = parseInt(cnum);

Answer 2

更新代码为：

var total= parseInt(document.getElementById('total').value);

因为您正在使用 total 与 anum 进行比较。所以总计

一定是错误 Nan

Answer 3

嗯，我不明白你的逻辑，但你得到了 NAN，因为你的字段值是空的。

试试这个代码

var val=0;
var total=document.getElementById('total').value;
var cnum=document.getElementById('cnum').value;
var anum;
function add()
{
    var n=0;
    while(n<cnum)
    {
        anum = 0;
        if(document.getElementById('aq'+n).value != "")        {            
                anum=parseInt(document.getElementById('aq'+n).value);
            }
        val += anum;
        n++;
    }
    if(total==anum)
    {
        alert('Its Work');
    }
    else
    {
        alert('Its not Work');
    }

}

Answer 4

为什么不直接将 PHP 变量包含到 JS 变量中？

var cnum=<?php echo $cnum ;?>;

也可以检查“”，然后使用零

parseInt(input.value)||0;

Answer 5

更新JS部分：

var total=document.getElementById('total').value;
total = parseInt(total);
var cnum=document.getElementById('cnum').value;
cnum= parseInt(cnum);

function add()
{
var anum;
var val=0;
var n=0;
while(n<cnum)
{
    anum = 0;
    var temp = document.getElementById('aq'+n).value;
    if( temp != "")        {            
            anum=parseInt(temp);
        }
    val = +val + anum;
    n++;
}
alert(val);

}

var total=document.getElementById('total').value;
total = parseInt(total);
var cnum=document.getElementById('cnum').value;
cnum= parseInt(cnum);

function add()
{
var anum;
var val=0;
var n=0;
while(n<cnum)
{
    anum = 0;
    var temp = document.getElementById('aq'+n).value;
    if( temp != "")        {            
            anum=parseInt(temp);
        }
    val = +val + anum;
    n++;
}
alert(val);

}

<form action="" method="post">
        <input name="total" id="total" value="10" type="hidden">
        <input name="cnum" id="cnum" value="10" type="hidden">
                <input id="aq0" onkeyup="add();" name="aq0" value="" type="number"><br>
                    <input id="aq1" onkeyup="add();" name="aq1" value="" type="number"><br>
                    <input id="aq2" onkeyup="add();" name="aq2" value="" type="number"><br>
                    <input id="aq3" onkeyup="add();" name="aq3" value="" type="number"><br>
                    <input id="aq4" onkeyup="add();" name="aq4" value="" type="number"><br>
                    <input id="aq5" onkeyup="add();" name="aq5" value="" type="number"><br>
                    <input id="aq6" onkeyup="add();" name="aq6" value="" type="number"><br>
                    <input id="aq7" onkeyup="add();" name="aq7" value="" type="number"><br>
                    <input id="aq8" onkeyup="add();" name="aq8" value="" type="number"><br>
                    <input id="aq9" onkeyup="add();" name="aq9" value="" type="number"><br>

如何用 javascript 添加 n 个输入值

how to add n number of input value with javascript

javascript

php

input

add