[英]Adding percentage button to javascript calculator
I am working on a calculator program to practice and aid in learning javascript. 我正在研究一个计算器程序,以练习和帮助学习JavaScript。 I have this so far: 到目前为止,我有:
<!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>
I have a couple questions: 我有几个问题:
Can someone help me out here? 有人可以帮我吗? Thanks! 谢谢!
The calculator above doesn't seem to work for me. 上面的计算器似乎不适用于我。
However, I can make a couple of suggestions that think will help you a long the way. 但是,我可以提出一些建议,这些建议对您有很大帮助。
A) Please don't take this the wrong way. A)请不要以错误的方式处理。 Part of programming is resolving the issues that you are having -- that is the fun of it. 编程的一部分是解决您遇到的问题,这就是乐趣。 Gets more fun when your under pressure of deadlines. 在截止日期的压力下获得更多乐趣。
B) I would recommend using jQuery. B)我建议使用jQuery。 You will inherently learn javascript. 您将天生学习javascript。
C) Finally, use div tags to write the validated key press to read from that separating the values by operators. C)最后,使用div标签编写经过验证的按键,以读取由操作员分隔值的按键。
eg: 例如:
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);
Hope that helps - good luck with learning java 希望对您有所帮助-学习Java祝您好运
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.