我正在尝试使用 Objects 制作计算器。这是 JSFiddle:http: //jsfiddle.net/jNqEv/4/
在我制作计算器的其余部分时,我正在使用这段代码来计算数字:
/*Computes the values inside the box and returns the answer.*/
function compute(form)
{
form.display.value = eval(form.display.value);
}
现在我需要创建一个执行计算的对象,而不是使用 JavaScript 预定义的对象 eval。我在想这样的事情:
基本上,这个对象从 id 为“输入”的文本框中获取值这些值将采用 2*3、1+2,5/7 等形式......所以我在想如果我拉第二块使用 substr 的字符串中的数据然后我可以检查它是否是乘法、除法、减法或加法。
function calc(arithmetic)
{
this.arithmetic = arithmetic;
}
var myCalc = new calc(input)
{
function maths (input)
{
var str = input;
var a=str.substr(1,1); // example: 1+2 var a holds the 1
var b=str.substr(2,1); // var b holds the "+"
var c=str.substr(3,1); // var c holds the 2
// if the sign is equal to "+" add var a plus var b
// and then place them inside answerNumber.
// then take answerNumber and place its value
// inside the page element with the id "input"
if(b == "+")
{
answerNumber = a + c;
}
else if(b == "-")
{
answerNumber = a + c;
}
else if(b == "*")
{
answerNumber = a * c;
}
else if(b == "/")
{
answerNumber = a / c;
}
document.getElementById("input").value=answerNumber;
}
}
我已经尝试在各种网站上阅读有关对象的信息,但它们根本没有帮助,以下是我去过的一些地方:“http://www.crockford.com/javascript/private.html”、“http: //www.w3schools.com/js/js_objects.asp”等等。对于我正在尝试做的事情,这些似乎不是很有用。也许你们中的一些人可以提供帮助。
这是对象函数将被触发和放置到的按钮和文本框:
<input type="button" value=" = " name="enter" onClick="compute(this.form)">
<input name="display" id="input" size=25>
这是我的整个代码表,包括外部 JavaScript。
HTML:
<html>
<head>
<title>Assignment 2</title>
</head>
<body>
<div align="center">
<span style="font-weight:bold" size="20">Calculator</span>
<br>
<!-- Prints my name -->
<form name="MyName" id="form1" style="font-weight:bold" size="20">
<script>
document.write("Mallery, Cody");
</script>
</form>
<!-- Script -->
<script src="functions.js" type="text/javascript"></script>
<!-- The Calculator! -->
<center><form>
<table border=4>
<tr>
<td>
<input name="display" id="input" size=25>
<br>
</td>
</tr>
<tr>
<td>
<input type="button" value=" 7 " onClick="addChar(this.form.display, '7')">
<input type="button" value=" 8 " onClick="addChar(this.form.display, '8')">
<input type="button" value=" 9 " onClick="addChar(this.form.display, '9')">
<input type="button" value=" / " onClick="addChar(this.form.display, '/')">
<br>
<input type="button" value=" 4 " onClick="addChar(this.form.display, '4')">
<input type="button" value=" 5 " onClick="addChar(this.form.display, '5')">
<input type="button" value=" 6 " onClick="addChar(this.form.display, '6')">
<input type="button" value=" * " onClick="addChar(this.form.display, '*')">
<br>
<input type="button" value=" 1 " onClick="addChar(this.form.display, '1')">
<input type="button" value=" 2 " onClick="addChar(this.form.display, '2')">
<input type="button" value=" 3 " onClick="addChar(this.form.display, '3')">
<input type="button" value=" - " onClick="addChar(this.form.display, '-')">
<br>
<input type="button" value=" 0 " onClick="addChar(this.form.display, '0')">
<input type="button" value=" N " onClick="changeSign(this.form.display)">
<input type="button" value=" + " onClick="addChar(this.form.display, '+')">
<input type="button" value=" C " onClick="this.form.display.value = 0 ">
<br>
<input type="button" value=" L " name="L" onClick="Loop(this.form.display.value)"
title="If the L button is pressed, the digit present in the results box will be looped through and added up to the 'digit plus 10'.For example: After the calculator has been reset. The user can press the 1 button, then the L button 55 should be displayed in the calculator 1 + 10 = 11, therefore start with 1 and loop until less than 11 adding all of the numbers 1 + 2 + 3 + 4 + 5 + 6 + 7 + 8 + 9 + 10 = 55">
<input type="button" value=" = " name="enter" onClick="compute(this.form)">
</td>
</tr>
</table>
<br>
<!-- Calculator User Guide -->
<span style="font-weight:bold" size="20">Instructions:</span>
<span size="16">
<br>Click a number, then an action, then another number, then the '=' button.
<br>Press 'C' when ready to start over.
<br>The 'N' makes your previous number negative.
<br>The 'L' button requires one number to be avalible,
<br>It will loop through "that number" to "ten plus that number"
<br> and add all values and display.
<br>
<br>For example 1+2+3+4+5+6+7+8+9+10 = 55
</span>
<br><br>
<!-- Browser information -->
<span style="font-weight:bold" size="20">Navigator:</span>
<div id="Navigator"></div>
<script language="javascript">
txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
document.getElementById("Navigator").innerHTML=txt;
</script>
</form>
</div>
</body>
</html>
外部 JavaScript:
/* gets the input from the keyboard OR clicking the button */
function addChar(input, character)
{
if(input.value == null || input.value == "0")
input.value = character;
else
input.value += character;
}
/*changes the sign of the number inside the input box from negative to positive.*/
function changeSign(input)
{
if(input.value.substring(0, 1) == "-")
input.value = input.value.substring(1, input.value.length);
else
input.value = "-" + input.value;
}
/*Computes the values inside the box and returns the answer.*/
function compute(form)
{
form.display.value = eval(form.display.value); /*The Calculator uses an Object for all calculations*/
}
/* Loops the input by the value + 10 */
function Loop(input)
{
var num = parseInt(input) + 10;
var i=0;
var sum=0;
while(i < num)
{
sum=sum+i;
i++;
}
document.getElementById("input").value=sum;
}
/*Compute Arithmetic*/
function calc() //creating an empty object named calc
{
}
var calc = new calc(); //creating a new instance of the calc object
calc.arithmetic = function maths (input)
{
var str = input;
var a=str.substr(1,1);
var b=str.substr(2,1);
var c=str.substr(3,1);
if(b == "+")
{
answerNumber = a + c;
}
else if(b == "-")
{
answerNumber = a + c;
}
else if(b == "*")
{
answerNumber = a * c;
}
else if(b == "/")
{
answerNumber = a / c;
}
document.getElementById("input").value=answerNumber;
}
因此,您可以向我指出正确方向的任何方式都值得赞赏。