Question

我有等式：（（A x B） - （C x D））/（C - B）

我想制作一个看起来像这样的计算器：

https://i.stack.imgur.com/K5T1F.png

该截图是我从其他网站编辑的内容，并将其调整为我希望最终产品看起来相似的内容。基本上用户在框中键入他们的数字并按下答案按钮以显示答案。（在答案按钮的右侧）

我不一定希望有人为我这样做，因为它可能很难，但我想知道它是如何完成的。就像我说的，我已经编辑了另一个网站的代码：编辑：我不能发布超过2个链接，但它看起来非常像截图。

我真的不知道怎么做这个，我想学习如何制作这样的“计算器”。您在框中键入“A，B，C，D”，它会为您解决。我用Python创建了这个程序，但我不知道如何让它变成我想要的样子。以下是我和朋友制作的python代码的链接：https://repl.it/FQJu/2

我会尽力回复评论，谢谢！还请注意，我对这个东西很不满意。

Answer 1

我看到你在这里有python和Javascript作为标签。我觉得使用Javascript / HTML比使用python更容易完成任务，特别是如果目标是将其托管在某个地方的互联网上。

我建议查看一个简单的HTML布局，它们很容易找到，并且会为您提供显示文本和输入框所需的正确基本结构。

了解通过头部将JQuery链接到HTML的概念。确保您的输入框和提交按钮具有唯一的ID，以便您可以使用javascript轻松访问它们。

我建议为显示的答案添加一个地方，这也有一个唯一的ID

您还需要将javascript文件链接到HTML，这将是您的基本设置。

在javascript文件中，您将尝试完成以下操作：

首先，您需要使用JQuery来定义文档就绪语句。
在准备好的文档中，您需要将一个on（“click”）函数附加到提交按钮，根据其id，在单击内部，您将运行逻辑以获取用户输入的值。
为您的第一个输入定义一个变量，然后使用jquery选择该元素，并将该值赋给变量
为每个输入重复此操作
一旦你将所有输入都放在变量中，你就可以做任何你需要的数学
此时，您需要使用Jquery选择答案显示元素，并为其分配数学答案的值。
如果你感觉很沮丧，那么你可以使用JQuery选择所有用户输入并将它们设置为空值，这样就可以轻松完成更多的计算。

Answer 2

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
    <script>

      function calculate(){
        var A = document.getElementById("a").value;
        var B = document.getElementById("b").value;
        var C = document.getElementById("c").value;
        var D = document.getElementById("d").value;

        var ans = ((A * B) - (C * D)) / (C - B);
        alert(ans);
      }
</script>
  </head>

  <body>
    <input type='number' id='a'/>
    <input type='number' id='b'/>
    <input type='number' id='c'/>
    <input type='number' id='d'/>
    <button onClick='calculate()'>calculate</button>
  </body>

</html>

Answer 3

<form >
Enter your target average damage:
<input type="number" name="tad"><br>
Enter the amount of battles you want to achieve it:
<input  type="number"name="tnb"><br>
Enter your current number of battles:
<input type="number" name="cnb"><br>
Enter your current average damage:
<input type="number" name="cad"><br>

<button type="button" onclick="answer.value=(
((parseFloat(tnb.value) * parseFloat(tad.value)) - (parseFloat(cad.value) * parseFloat(cnb.value))) / (parseFloat(tnb.value) - parseFloat(cnb.value)) || '');
answer2.value=answer.value;
nb.value=tnb.value;">Solve</button><br>

answer:<output name="answer"></output><br><br>
You have to do <output name="answer2">?</output>
damage per game before you hit your <output name="nb">?</output> battles.
</form>
<output>

您也可以删除按钮并将onclick字符串移动到表单的oninput。它会自动显示答案。

如何为自定义方程式制作输入计算器？

3 个答案: