Javascript 输入框计算器不会更改结果值_Javascript_Jquery_Html

Javascript 输入框计算器不会更改结果值

javascript jquery html

Javascript 输入框计算器不会更改结果值,javascript,jquery,html,Javascript,Jquery,Html,我需要做一个带输入框的计算器这是我的代码，由于某些原因，它不会更改结果框的值如您所见，我尝试了.val（“结果”）和.attr（“值”、“结果”）两者都不起作用有人帮忙真是太好了 <html> <head> <meta charset="utf-8" /> <title>Praktikum Webanwendungen</title> <style> input,

我需要做一个带输入框的计算器

这是我的代码，由于某些原因，它不会更改结果框的值

如您所见，我尝试了

.val（“结果”）

和

.attr（“值”、“结果”）

两者都不起作用

有人帮忙真是太好了

<html>
  <head>
    <meta charset="utf-8" />
    <title>Praktikum Webanwendungen</title>
    <style>
      input,
      button {
        margin: 10px;
      }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
        $(document).ready(function(){
            $("#b1").click(function(){
                Add();
            });
            $("#b2").click(function(){
                Substract();
            });
            $("#b3").click(function(){
                Multiply();
            });
            $("#b4").click(function(){
                Divide();
            });
        });
        function Add(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1+no2;    
          $("#ergebnis").attr("value","result")
        }    
        function Substract(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1-no2;    
          $("#ergebnis").val(result)    
        }    
        function Multiply(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1*no2;    
          $("#ergebnis").val("result")    
        }    
        function Divide(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1/no2;    
          $("#ergebnis").val("result") 
        }
    </script>
  </head>
  <body>

    <h1>Taschenrechner</h1>
    <label for="num1">Zahl1: </label>
    <input id="number1" name="num1" type="number" />

    <label for="num2">Zahl2: </label>
    <input id="number2" name="num2" type="number" />

    <div>
      <button id="b1">+</button>
      <button id="b2">-</button>
      <button id="b3">x</button>
      <button id="b4">/</button>
    </div>

    <label for="res">Ergebnis: </label>
    <input id="ergebnis" name="res" type="number" value = "" >
  </body>
</html>


韦班文登广场酒店
输入
钮扣{
利润率：10px；
}
$（文档）.ready（函数（）{
$（“#b1”）。单击（函数（）{
添加（）；
});
$（“#b2”）。单击（函数（）{
减法（）；
});
$（“#b3”）。单击（函数（）{
乘法（）；
});
$（“#b4”）。单击（函数（）{
除法（）；
});
});
函数Add（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1+no2；
$（“#ergebnis”）.attr（“值”、“结果”）
}    
函数减法（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1-no2；
$（“#ergebnis”）.val（结果）
}    
函数Multiply（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1*no2；
$（“#ergebnis”）.val（“结果”）
}    
函数Divide（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1/no2；
$（“#ergebnis”）.val（“结果”）
}
塔什恩雷奇纳
Zahl1：
扎尔2：
+
-
x
/
Ergebnis：

您忘记关闭脚本标记。我已经更新了你的代码，请检查

<html>
  <head>
    <meta charset="utf-8" />
    <title>Praktikum Webanwendungen</title>
    <style>
      input,
      button {
        margin: 10px;
      }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("#b1").on('click',function(){
                Add();
            });
            $("#b2").on('click',function(){
                Substract();
            });
            $("#b3").on('click',function(){
                Multiply();
            });
            $("#b4").on('click',function(){
                Divide();
            });
        });
        function Add(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1+no2;    
          $("#ergebnis").val(result)
        }    
        function Substract(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1-no2;    
          $("#ergebnis").val(result)    
        }    
        function Multiply(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1*no2;    
          $("#ergebnis").val(result)    
        }    
        function Divide(){    
         var no1=parseInt($("#number1").val());    
         var no2=parseInt($("#number2").val());    
         var result =no1/no2;    
          $("#ergebnis").val(result) 
        }
    </script>
  </head>
  <body>

    <h1>Taschenrechner</h1>
    <label for="num1">Zahl1: </label>
    <input id="number1" name="num1" type="number" />

    <label for="num2">Zahl2: </label>
    <input id="number2" name="num2" type="number" />

    <div>
      <button id="b1">+</button>
      <button id="b2">-</button>
      <button id="b3">x</button>
      <button id="b4">/</button>
    </div>

    <label for="res">Ergebnis: </label>
    <input id="ergebnis" name="res" type="number" value = "" >
  </body>
</html>


韦班文登广场酒店
输入
钮扣{
利润率：10px；
}
$（文档）.ready（函数（）{
$（“#b1”）。在（'单击'，函数（）上{
添加（）；
});
$（“#b2”）。在（'click'，function（）上{
减法（）；
});
$（“#b3”）。在（'click'，function（）上{
乘法（）；
});
$（“#b4”）。在（'click'，function（）上{
除法（）；
});
});
函数Add（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1+no2；
$（“#ergebnis”）.val（结果）
}    
函数减法（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1-no2；
$（“#ergebnis”）.val（结果）
}    
函数Multiply（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1*no2；
$（“#ergebnis”）.val（结果）
}    
函数Divide（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1/no2；
$（“#ergebnis”）.val（结果）
}
塔什恩雷奇纳
Zahl1：
扎尔2：
+
-
x
/
Ergebnis：

以下是解决方案。导入Jquery后，必须关闭它的脚本标记，然后为代码打开一个新的

标记。此外，双引号可能会干扰输出


韦班文登广场酒店
输入
钮扣{
利润率：10px；
}
$（文档）.ready（函数（）{
$（“#b1”）。单击（函数（）{
添加（）；
});
$（“#b2”）。单击（函数（）{
减法（）；
});
$（“#b3”）。单击（函数（）{
乘法（）；
});
$（“#b4”）。单击（函数（）{
除法（）；
});
});
函数Add（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1+no2；
$（“#ergebnis”）.val（结果）
}    
函数减法（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1-no2；
$（“#ergebnis”）.val（结果）
}    
函数Multiply（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1*no2；
$（“#ergebnis”）.val（结果）
}    
函数Divide（）{
var no1=parseInt（$（“#number1”）.val（）；
var no2=parseInt（$（“#number2”）.val（）；
var结果=no1/no2；
$（“#ergebnis”）.val（结果）
}
塔什恩雷奇纳
Zahl1：
扎尔2：
+
-
x
/
Ergebnis：

您正在以双引号传递结果变量。删除双引号。仍然不起作用：/