Question

我正在开发一个计算器程序来练习和帮助学习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) {
	if(input.value == null || input.value == "0")
		input.value = character
	else
		input.value += character
}

function sqrt(form) {
	form.display.value = Math.sqrt(form.display.value);
}

function changeSign(input) {
	if(input.value.substring(0, 1) == "-")
		input.value = input.value.substring(1, input.value.length)
	else
		input.value = "-" + input.value
}

function compute(form) {
	form.display.value = eval(form.display.value)
}

function checkNum(str) {
	for (var i = 0; i < str.length; i++) {
		var ch = str.substring(i, i+1)
		if (ch < "0" || ch > "9") {
			if (ch != "/" && ch != "*" && ch != "+" && ch != "-" && ch != "."
				&& ch != "(" && ch!= ")") {
				alert("invalid entry!")
				return false
				}
			}
		}
		return true
}
</script>
</head>
<body>
	<form name="sci-calc">
		<table  border="2"CELLSPACING="1" CELLPADDING="5" align="center" >
		<tr>
			<td COLSPAN="3" align="center"><input name="display" value="0" SIZE="28" MAXLENGTH="25"></td>
			<td align="center" colspan="1" ><input type="button" value="  %  " ONCLICK="addChar(this.form.display, '%')" style="width: 135px"></td>

		</tr>
		<tr>
			<td align="center" colspan="1" ><input type="button" value="  7  " ONCLICK="addChar(this.form.display, '7')" style="width: 135px"></td>
			<td align="center" colspan="1" ><input type="button" value="  8  " ONCLICK="addChar(this.form.display, '8')" style="width: 136px" ></td>
			<td align="center"colspan="1"><input type="button" value="  9  " ONCLICK="addChar(this.form.display, '9')" style="width: 135px" ></td>
			<td align="center"colspan="1"><input type="button" value="   +  " ONCLICK="addChar(this.form.display, '+')" style="width: 137px"></td>
		</tr>
		<tr>
			<td align="center"colspan="1"><input type="button" value="  4  " ONCLICK="addChar(this.form.display, '4')" style="width: 133px"></td>
			<td align="center" colspan="1"><input type="button" value="  5  " ONCLICK="addChar(this.form.display, '5')" style="width: 131px"></td>
			<td align="center"colspan="1"><input type="button" value="  6  " ONCLICK="addChar(this.form.display, '6')" style="width: 134px"></td>
			<td align="center"colspan="1"><input type="button" value="   -   " ONCLICK="addChar(this.form.display, '-')" style="width: 139px"></td>
		</tr>
		<tr>
			<td align="center"colspan="1" ><input type="button" value="  1  " ONCLICK="addChar(this.form.display, '1')" style="width: 133px"></td>
			<td align="center" colspan="1"><input type="button" value="  2  " ONCLICK="addChar(this.form.display, '2')" style="width: 128px"></td>
			<td align="center"colspan="1"><input type="button" value="  3  " ONCLICK="addChar(this.form.display, '3')" style="width: 132px"></td>
			<td align="center"colspan="1"><input type="button" value="   *   " ONCLICK="addChar(this.form.display, '*')" style="width: 137px"></td>
		</tr>
		<tr>
			<td align="center"colspan="1"><input type="button" value="  0  " ONCLICK="addChar(this.form.display, '0')" style="width: 131px"></td>
			<td align="center" ><input type="button" value="   .  " ONCLICK="addChar(this.form.display, '.')" style="width: 129px"></td>
			<td align="center"><input type="button" value=" sqrt " ONCLICK="if (checkNum(this.form.display.value)) { sqrt(this.form) }" style="width: 136px"></td>
			<td align="center"><input type="button" value="   /   " ONCLICK="addChar(this.form.display, '/')" style="width: 139px"></td>
		</tr>
		<tr>
			<td align="center" ><input type="button" value="    (    " ONCLICK="addChar(this.form.display, '(')" style="width: 131px"></td>
			<td align="center" ><input type="button" value="   )   " ONCLICK="addChar(this.form.display, ')')" style="width: 132px"></td>
			<td align="center" ><input type="button" value="=" name="enter" ONCLICK="if (checkNum(this.form.display.value)) { compute(this.form) }" style="width: 141px"></td>
			<td align="center" ><input type="button" value="clear" ONCLICK="this.form.display.value = 0 " style="width: 141px"></td>
		</tr>
		</table>
	</form>
</html>

我有几个问题：

我需要一个工作百分比按钮，我现在所做的那个按钮不能做我需要做的事情。它应该显示第一个输入数字的第二个。即如果第一个数字是5而第二个数字是20，那么结果应该是25（意味着25％）。
我需要显示输入的所有操作，而不仅仅是用户执行的计算结果。例如，在3 + 4上，不显示“7”，而是显示“3 + 4 = 7”。保持输入字段中所有先前计算的显示，而不仅仅是当前计算。

有人可以帮助我吗？谢谢！

Answer 1

上面的计算器似乎对我不起作用。
但是，我可以提出一些建议，认为这将对你有所帮助。

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的好运

将百分比按钮添加到javascript计算器

1 个答案: