Question

我想自动计算通过MySQL生成的<input>值。这是我的代码：

<html>
<head>
<title>Untitled Document</title>
<link href="plugins/jquery-ui/jquery-ui.min.css" rel="stylesheet"> 
<script src="plugins/jquery/jquery-2.1.0.min.js"></script>
<script src="plugins/jquery-ui/jquery-ui.min.js"></script>
</head>
<body>
<h1>TEST 1</h1>
<?php
require("dbconnect.php");
$e= mysql_query("select center from center") or die(mysql_error());
$g = 1;
while($f = mysql_fetch_array($e))
{
    ?>
    <?php echo $f['center'].': '; ?> <input type="text" class="form-control" name="<?php echo $f['center']; ?>" id="<?php echo $g;?>" onkeyup="calc1()"/><br />
    <?php
    $g++;   
}
?>  
Answer: <input type="text" class="form-control" name="ans" id="ans" readonly/>
<script>
function calc1()
{
    var no = <?php echo json_encode($g); ?>;
    var i = 1;
    while(i <= no)
    {
        var vl = document.getElementById('i').value ;
        var v2 += Number(vl);
        $('#ans').val(v2);
        i++;
    }
    //alert(no);
}
</script>
<br />
<h1>TEST 2</h1>
<input type="text" name="1" id="1" onkeyup="calc()" />
<input type="text" name="2" id="2" onkeyup="calc()" />
<input type="text" name="answer" id="answer" readonly/>
<script>
function calc()
{
    var vl = document.getElementById('1').value;
    var v2 = document.getElementById('2').value;
    var v3 = (Number(vl)+Number(v2));
    $('#answer').val(v3);
    //alert(v3);
}
</script>
</body>
</html>

示例1根据MySQL数据生成<input>，我希望在最后一个文本框中添加并显示这些<input>值。示例2只是两个文本框的测试添加，应显示最后一个文本框中两个文本框的总和，但两者都不起作用。我的代码出了什么问题？任何帮助或指导将不胜感激。

更新<！/强>

在Sean的帮助下，我已将功能更改为：

function calc1() { var no = <?php echo json_encode($g); ?>; var i = 1; var v2 = 0; while(i <= no) { var vl = document.getElementById(i).value ; v2 += Number(vl); i++; } $('#ans').val(v2); //alert(no); }

哪些仍然无效。我能够让Sample 2工作。错误是我已将示例2的文本框设置为1和2（我的错），这也是示例1的文本框＆＃39; IDS。所以我现在把它改成了，这使它现在起作用了。

<h1>TEST 2</h1> <input type="text" name="1" id="tb1" onkeyup="calc()" /> <input type="text" name="2" id="tb2" onkeyup="calc()" /> <input type="text" name="answer" id="answer" readonly/> <script> function calc() { var vl = document.getElementById('tb1').value; var v2 = document.getElementById('tb2').value; var v3 = (Number(vl)+Number(v2)); $('#answer').val(v3); //alert(v3); } </script>

现在唯一的问题是如何让Sample 1工作。

使用mysql循环实时计算输入值

0 个答案: