使用 Jquery 进行算术运算答案

【问题标题】：Arithmetic operations using Jquery使用 Jquery 进行算术运算
【发布时间】：2015-11-10 13:38:26
【问题描述】：

我有 3 个文本框，2 个用于输入值，第 3 个用于操作数，根据操作数输入它应该执行相关操作。

HTML

Num1:<input type="text" value=0 id="first"  class="box1"><br>
Num2:<input type="text" value=0 id="second" class="box2"><br>
Op:<input type="text" value="+" id="oper"   class="box3"><br>
<p id="demo"><b>Sum:0.00</b></p>

文档焦点的加载应在第一个文本框上，应完成必填字段的验证，结果应固定为小数点后 2 位。

jQuery

$(document).ready(function () {
    $("#demo").focus();

    var x = parseInt($('#first').val());
    var y = parseInt($('#second').val());
    var z = $('#oper').val();

    $("#first,#second,#oper").onkeyup(function () {
        switch (z) {
        case ("+"):
            var a = ((x + y).toFixed(2));
            $('#demo').text("Sum:" + a);
            if ((isNaN(x) || x == "") && (isNaN(y) || y == "")) {
                $('#demo').text("Sum:Enter a valid number!");
            }
            break;
        case ("-"):
            var b = ((x - y).toFixed(2));
            $('#demo').text("Sub:" + b);
            if ((isNaN(x) || x == "") && (isNaN(y) || y == "")) {
                $('#demo').text("Sub:Enter a valid number!");
            }
            break;
        case ("*"):
            var c = ((x * y).toFixed(2));
            $('#demo').text("Mul:" + c);
            if ((isNaN(x) || x == "") && (isNaN(y) || y == "")) {
                $('#demo').text("Mul:Enter a valid number!");
            }
            break;
        case ("/"):
            var d = ((x / y).toFixed(2));
            $('#demo').text("Div:" + d);
            if ((isNaN(x) || x == "") && (isNaN(y) || y == "")) {
                $('#demo').text("Div:Enter a valid number!");
            }
            break;
        default:
            $('#demo').text("Invalid operator");
        }
    });
});

正在尝试修复错误，请任何人帮助我！

【问题讨论】：

事件是keyup 而不是onkeyup
我已经改成keyup了，还是不行

标签： javascript jquery

【解决方案1】：

正如 Tushar 所说，事件是使用 keyup 处理的，而不是 onkeyup。

您需要将变量分配移动到keyup handler，因为您希望每次更改时都重新计算它们。

$(document).ready(function () {

    $("#first").focus();

    $("#first,#second,#oper").keyup(function () {

      var x = parseInt($('#first').val());
      var y = parseInt($('#second').val());
      var z = $('#oper').val();

        switch (z) {
         ....

要关注第一个文本框，您需要关注第一个文本框 id，而不是 p 标签。

$("#first").focus();

这将像您期望的那样工作。

【讨论】：

【解决方案2】：

我已经解决了这个问题，你可以在 js fiddle 上查看，如果你有任何问题，请告诉我。

link here --http://jsfiddle.net/FHf9a/317/

【讨论】：