如何爲自定義方程製作輸入計算器？

我有公式：（（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

我會嘗試回覆評論，謝謝！還請注意，我是這個東西的noobie。

來源

2017-08-31 Johnny Snippit

第一個和最後一個盒子有什麼不同？ *輸入*和*輸入*是唯一的區別，你究竟想要計算什麼？似乎你想要計算幾件事情（因爲你也要求當前的傷害輸出）。 – Gendarme

難道你不能只是圍繞你的python代碼構建一個gui嗎？ – jmh

創建四個''字段，其中包含像'id =「a」'等唯一ID。添加一個按鈕和一個div來顯示答案。然後使用JavaScript，在按鈕上設置一個點擊事件監聽器，通過ID「獲取」這四個字段。將它們的'value'設置爲'var a'等變量，然後將'（（A * B） - （C * D））/（C - B）'的結果設置爲答案的'innerHTML' DIV。 –

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

來源

2017-08-31 18:03:28

現在這個人停止學習並使用你的代碼：.. –

@JohnnySnippit但是請確保你使用這個作爲參考，並嘗試學習不同的方式來實現這樣的任務在JS中。 –

@jigar感謝forumla，即時通訊使用它來幫助我編寫代碼，但我有一個問題，當我點擊計算器按鈕時，會彈出一個窗口，並且我知道那是因爲alert（ans）;'但有什麼辦法讓答案出現在按鈕旁邊的文本中？ –

我看到你有python和Javascript作爲標籤在這裏。我覺得使用Javascript/HTML比使用python更容易完成任務，特別是如果目標是將其託管在互聯網上。

我會建議看一個裸露的骨骼HTML佈局，他們很容易找到，並會給你正確的基本結構，需要顯示您的文本和輸入框。

研究通過頭將JQuery鏈接到您的HTML的概念。確保您的輸入框和您的提交按鈕具有唯一的ID，以便您可以使用JavaScript輕鬆訪問它們。

我建議增加的答案顯示的地方，這也有一個唯一的ID

你也想的JavaScript文件鏈接到HTML，這將是您的基本設置。

在JavaScript文件，你會嘗試完成以下任務：

首先第一件事情，你會想使用jQuery來定義文檔準備發言。
在準備好的文檔中，您需要在提交按鈕上添加一個on（「click」）函數，基於它的id，在click內部，您將運行邏輯以獲取用戶輸入的值。
定義一個變量爲你的第一個輸入，然後使用jQuery選擇元素，並將該值賦給變量
重複此爲每個輸入
一旦你把所有的變量你的投入，你可以做無論你需要什麼數學
在這一點上，你會想選擇你的答案顯示元素與Jquery，並將其分配給數學的答案的值。
如果您感覺青蛙，您可以使用JQuery來選擇所有的用戶輸入並將它們設置爲空白值，以便更輕鬆地完成更多計算。

來源

2017-08-31 17:51:53

那麼我建議他使用平面javascript在潛入jquery之前.. :) –

<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。它會自動顯示答案。

來源

2017-08-31 18:04:33 TCPN

如何爲自定義方程製作輸入計算器？

回答

相關問題