Question

我想在没有命令按钮的情况下计算前2个文本框的值示例我有3个文本框。

前2个，数字将被输入，最后1个将是总和或产品等等。现在我想要它自动计算。例如，我在第1个2文本框中输入值2和3，然后自动输出总和或产品或在第3个文本框中显示的任何结果。我怎么能这样做？感谢

    <html>
    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script>
    $('#texttwo').keyup(function(){
    var textone;
    var texttwo;
    textone = parseFloat($('#textone').val());
    texttwo = parseFloat($('#texttwo').val());
    var result = textone + texttwo;
    $('#result').val(result.toFixed(2));
    });
    </script>
    </head>
    <body>
    <input type="text" name="value1" id="textone">
    <input type="text" name="value2" id="texttwo">
    <input type="text" name="result" id="result">
    </body>
    </head>

Answer 1

您可以使用jQuery实现此目的。将jQuery添加到您的<head>

中，在项目中加入jQuery

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

然后，在文件的末尾：

<script>
$('#texttwo').keyup(function(){
    var textone;
    var texttwo;
textone = parseFloat($('#textone').val());
texttwo = parseFloat($('#texttwo').val());
var result = textone + texttwo;
$('#result').val(result.toFixed(2));


    });
</script>

当您更改第二个框的值时，这将为您提供结果。

您也需要这样做：

更改

    <input type=text name=value1>
    <input type=text name=value2>
    <input type=text name=result>

为：

    <input type="text" name="value1" id="textone">
    <input type="text" name="value2" id="texttwo">
    <input type="text" name="result" id="result">

修改

这是我的整个文件：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<input type="text" name="value1" id="textone">
<input type="text" name="value2" id="texttwo">
<input type="text" name="result" id="result">

<script>
    $('#texttwo').keyup(function(){
        var textone;
        var texttwo;
        textone = parseFloat($('#textone').val());
        texttwo = parseFloat($('#texttwo').val());
        var result = textone + texttwo;
        $('#result').val(result.toFixed(2));


    });
</script>

使用jQuery自动计算文本框的值

1 个答案: