javascript - 输入框计算器不更改结果值-6ren

javascript - 输入框计算器不更改结果值

转载作者：行者123 更新时间：2023-12-02 22:24:49

25

4

我需要制作一个带有输入框的计算器。

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

如你所见，我尝试了 .val("result") 和 .attr("value","result")两者都不起作用。

一些帮助真的很好!

<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>

最佳答案

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

<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>

关于javascript - 输入框计算器不更改结果值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59105280/

25

4

0

文章推荐： php - 使用 PHP rand() 预测随机数的可能性

文章推荐：一个窗口的 eclipse 布局

文章推荐： javascript - 访问相似的 DOM 元素

窗口内的C++输入框
我试图在我的窗口中放置一个小的输入框，该窗口目前是一个黑色的窗口。我的代码在下面，谁能告诉我如何将输入框输入到窗口中，谢谢 "#include /* Declare Windows proce
具有多个输入字段的 Powershell 输入框
我发现这段代码可以为 powershell 创建简单的输入框: [void][Reflection.Assembly]::LoadWithPartialName('Microsoft.VisualBa
Excel VBA 输入框
我有以下 Excel 文件的输入框。我不想显示输入字符而需要显示输入框字符 * ，该怎么做？ Private Sub Workbook_Open() Dim UserName As String Us
Javascript:输入框 - 首字母自动大写但可以覆盖
我有一个名字输入框。我想在用户键入时自动将名称的第一个字母大写，但允许用户覆盖名称的更改，例如“de Salis”。我看到 here 这对于 CSS 是不可能的，因为 text-transform:
html - 悬停时仅显示文本、输入框
嘿，伙计们，我需要帮助，我有这个样式表，里面是管理 div...它目前的宽度为 20px，高度为 50px，当鼠标指针悬停时它会变大..我希望发生的是当我将鼠标指针悬停在那里时，它会展开文本和输入框，
html - CSS 输入框
我正在为我的 ASP.NET 应用程序开发 UI，我有一个登录表单，其中有一个框，框内有这样的字段。 (xxxx为输入框) Name: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
css - 输入框，移动正在输入的文本
为了给图标腾出空间，我将占位符文本 35px 移到了我的 input 的右侧；但是，当我开始在 input 字段中键入时，文本从图标后面开始。我尝试了一些谷歌搜索，但我还没有找到答案。我看到的搜索结
Python Tkinter 输入框
美好的一天。我正在尝试创建自己的输入框以用于我的项目。基本上我想做的是运行我的主窗体，它将调用第二个窗体。用户将在第二个上提供一些数据，当在第二个上按下确定/关闭按钮时，数据将传回第一个。功能类似于输
c# - 哪个控件用于快速文本输入(输入框)？
我需要一个快速文本输入对话框(其中包含一个文本框的 MessageBox)。是否有可用的控件或我应该使用表单？我只想让用户输入一些 ID。在其他情况下，我需要 2 个文本框作为用户名和密码。最佳答
HTML 输入框 - 禁用
禁用 HTML 的 INPUT 文本框的代码是什么？谢谢最佳答案参见 W3C HTML Specification on the input tag获取更多信息。关于HTML 输入框 - 禁
javascript - jQuery 按顺序放置 AND/OR 输入框
嘿，我正在努力寻找“最佳位置”，以便它能够按照我的需要工作。下面是我当前正在使用的 JS 代码。和框代码: $("#ANDbtn").click(function() { if (numOR
javascript - 如何通过按下按钮将上标文本添加到 HTML 输入框？
我正在提出一个问题，人们必须输入其中包含普通文本和上标的答案。我认为最好的方法是制作一个按钮，使用户能够将文本放入上标，然后转义上标，但我不知道如何解决这个问题并使文本显示为上标。这是我到目前为止所
javascript - 仅包含特定数字的 HTML 输入框
我需要一个输入文本框，它只能接受 0 和 1 的字符串，例如 00101110101。限制输入任何字母，但是，我们可以输入 1,2,3,4 等等。我需要将输入字符串限制为仅包含 0 和 1。有什么
javascript - 如何 slideDown() 输入框？
我有一个按钮，可以在前一个输入框的正下方添加一个输入框。我想添加一个动画，试图让它更流畅，而不是仅仅在那里弹出。到目前为止，我已经尝试过了，但是没有用。一个 fiddle 的例子会很棒。 var co
javascript - javascript添加和删除列表、输入框、选项选择等新元素的方法
我正在尝试使用 jquery 创建一个计算 GPA 的 webview 应用程序，我创建了两个按钮，其中一个用于添加新元素，另一个用于删除元素，我正在尝试添加多个元素同时，例如模块名称、学分输入和选项
html - 输入框 vs 输入框文本和占位符不透明度
我有一个简单的输入框具有以下样式: input { border-radius: 5px; width: 564px; opacity: 0.14; } 我的问题是因为我改
javascript - 将百分比相关的验证添加到 html 输入框
我有一个小页面，可让我通过单击“添加股票”按钮将股票添加到我的投资组合中，查看下图以供引用。单击“添加股票”按钮会弹出一个模式框，其中列出了我可以添加到我的投资组合中的股票。我可以通过单击“分配”
html - 红色的 Chrome 输入框
我想使用这个 css 设置:border-color: red; 对于 input 元素。但是当我这样做时，它们的指标与默认的 chrome 边框不同。请看这个jsfiddle: http://j
python - Tkinter 输入框，不允许一次输入和显示一个字符串
我正在尝试制作一个输入框，当它被聚焦时获取键盘输入，并且只在框的中间显示那个键名，没有闪烁的条，也不允许编辑。并且还将变量更改为键。所以如果 [ ] 是一个输入框。我输入 F7 然后框应该显示 [
python - Tkinter - 输入框 - 日期格式
我想要一个用于输入日期的输入框，以便用户只能以一种方式输入。键入前的输入框如下所示(没有下划线)__/__/____，以及 / 不会在用户键入日期时被删除。谢谢最佳答案感谢@Bryan Oak

首页

博学

6Ren·AI

商城

javascript - 输入框计算器不更改结果值