將百分比按鈕添加到JavaScript計算器

我正在研究一個計算器程序來練習和幫助學習JavaScript。我有這個至今：將百分比按鈕添加到JavaScript計算器

<!DOCtype html PUBLIC "-//W3C//Dtd XHTML 1.0 transitional//EN" "http://www.w3.org/tr/xhtml1/Dtd/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 

 
<head> 
 
<meta content="text/html; charset=utf-8" http-equiv="Content-type" /> 
 
<title>Calculator</title> 
 
<h1><center>On-Line Calculator</center></h1> 
 
<script LANGUAGE="Javascript"> 
 
function addChar(input, character) { 
 
\t if(input.value == null || input.value == "0") 
 
\t \t input.value = character 
 
\t else 
 
\t \t input.value += character 
 
} 
 

 
function sqrt(form) { 
 
\t form.display.value = Math.sqrt(form.display.value); 
 
} 
 

 
function changeSign(input) { 
 
\t if(input.value.substring(0, 1) == "-") 
 
\t \t input.value = input.value.substring(1, input.value.length) 
 
\t else 
 
\t \t input.value = "-" + input.value 
 
} 
 

 
function compute(form) { 
 
\t form.display.value = eval(form.display.value) 
 
} 
 

 
function checkNum(str) { 
 
\t for (var i = 0; i < str.length; i++) { 
 
\t \t var ch = str.substring(i, i+1) 
 
\t \t if (ch < "0" || ch > "9") { 
 
\t \t \t if (ch != "/" && ch != "*" && ch != "+" && ch != "-" && ch != "." 
 
\t \t \t \t && ch != "(" && ch!= ")") { 
 
\t \t \t \t alert("invalid entry!") 
 
\t \t \t \t return false 
 
\t \t \t \t } 
 
\t \t \t } 
 
\t \t } 
 
\t \t return true 
 
} 
 
</script> 
 
</head> 
 
<body> 
 
\t <form name="sci-calc"> 
 
\t \t <table border="2"CELLSPACING="1" CELLPADDING="5" align="center" > 
 
\t \t <tr> 
 
\t \t \t <td COLSPAN="3" align="center"><input name="display" value="0" SIZE="28" MAXLENGTH="25"></td> 
 
\t \t \t <td align="center" colspan="1" ><input type="button" value=" % " ONCLICK="addChar(this.form.display, '%')" style="width: 135px"></td> 
 

 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td align="center" colspan="1" ><input type="button" value=" 7 " ONCLICK="addChar(this.form.display, '7')" style="width: 135px"></td> 
 
\t \t \t <td align="center" colspan="1" ><input type="button" value=" 8 " ONCLICK="addChar(this.form.display, '8')" style="width: 136px" ></td> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" 9 " ONCLICK="addChar(this.form.display, '9')" style="width: 135px" ></td> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" + " ONCLICK="addChar(this.form.display, '+')" style="width: 137px"></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" 4 " ONCLICK="addChar(this.form.display, '4')" style="width: 133px"></td> 
 
\t \t \t <td align="center" colspan="1"><input type="button" value=" 5 " ONCLICK="addChar(this.form.display, '5')" style="width: 131px"></td> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" 6 " ONCLICK="addChar(this.form.display, '6')" style="width: 134px"></td> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" - " ONCLICK="addChar(this.form.display, '-')" style="width: 139px"></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td align="center"colspan="1" ><input type="button" value=" 1 " ONCLICK="addChar(this.form.display, '1')" style="width: 133px"></td> 
 
\t \t \t <td align="center" colspan="1"><input type="button" value=" 2 " ONCLICK="addChar(this.form.display, '2')" style="width: 128px"></td> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" 3 " ONCLICK="addChar(this.form.display, '3')" style="width: 132px"></td> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" * " ONCLICK="addChar(this.form.display, '*')" style="width: 137px"></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td align="center"colspan="1"><input type="button" value=" 0 " ONCLICK="addChar(this.form.display, '0')" style="width: 131px"></td> 
 
\t \t \t <td align="center" ><input type="button" value=" . " ONCLICK="addChar(this.form.display, '.')" style="width: 129px"></td> 
 
\t \t \t <td align="center"><input type="button" value=" sqrt " ONCLICK="if (checkNum(this.form.display.value)) { sqrt(this.form) }" style="width: 136px"></td> 
 
\t \t \t <td align="center"><input type="button" value=" / " ONCLICK="addChar(this.form.display, '/')" style="width: 139px"></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td align="center" ><input type="button" value=" ( " ONCLICK="addChar(this.form.display, '(')" style="width: 131px"></td> 
 
\t \t \t <td align="center" ><input type="button" value=" ) " ONCLICK="addChar(this.form.display, ')')" style="width: 132px"></td> 
 
\t \t \t <td align="center" ><input type="button" value="=" name="enter" ONCLICK="if (checkNum(this.form.display.value)) { compute(this.form) }" style="width: 141px"></td> 
 
\t \t \t <td align="center" ><input type="button" value="clear" ONCLICK="this.form.display.value = 0 " style="width: 141px"></td> 
 
\t \t </tr> 
 
\t \t </table> 
 
\t </form> 
 
</html>

我有幾個問題：

我需要一個工作百分比按鈕，一個我現在有沒有做什麼，我需要它去做。它應該顯示第一個輸入數字的第二個數字。即如果第一個數字是5，第二個數字是20，那麼結果應該是25（意思是25％）。
我需要顯示所有輸入的操作，而不僅僅是用戶執行的計算結果。例如，在3 + 4上，不是顯示「7」，而是顯示「3 + 4 = 7」。將所有以前的計算顯示在輸入欄中，而不是僅顯示當前的一個。

有人可以幫我嗎？謝謝！

來源

2014-12-10 Tyler Klimek

我假設你的百分比計算不工作，因爲方程式'5％20'爲'5模twenty'讀取。對於後者，只需將每個輸入記錄到一個變量中，或者使用'.value'從輸入字段中提取它（如果數學應該是可見的，那麼當前不是）。 – 2014-12-10 23:48:22

上面的計算器似乎不適合我。
但是，我可以提出一些想法可以幫助你的建議。 A）請不要誤以爲這是錯的。編程的一部分是解決你遇到的問題 - 這是它的樂趣。在最後期限的壓力下獲得更多樂趣。

B）我會推薦使用jQuery。你將天生學習JavaScript。 C）最後，使用div標籤來寫驗證的按鍵來讀取操作符分隔值。

如：

calculation=$('#output_div_id').val(); 
calculation_parts = calculation.split('+'); 
answer = parseInt(calculation_part[0]) + parseInt(calculation_part[1]). 

$('#output_div_id').html($('#output_div_id').html()+ "=" + answer);

希望幫助 - 好運學習Java

來源

2014-12-11 00:05:59 terary

將百分比按鈕添加到JavaScript計算器

回答

相關問題