【问题标题】:JavaScript Calculator in my Quiz我的测验中的 JavaScript 计算器
【发布时间】:2024-01-02 22:55:01
【问题描述】:

这是我将用于测验的代码。 代码有什么问题?

鼠标悬停(按钮)时,html会提示函数的描述,点击按钮会运行指定的函数。然后,它会提醒用户操作的答案。

<script type="text/javascript">
function a(){
alert('Adds the two numbers.');}
function b(){
alert('Subtracts the second number from the first number.');}
function c(){
alert('Multiplies the two numbers.');}
function d(){
alert('Divides the second number from the first number.');}
function add(){
var ans = form.none.value + form.notwo.value;
alert(form.none.value + '+' +form.notwo.value + '=' + ans);
}
function subtract(){
var ans = form.notwo.value - form.none.value;
alert(form.notwo.value + '-' form.none.value+ '=' + ans);
}
function times(){
var ans = form.none.value * form.notwo.value;
alert(form.none.value + '*' +form.notwo.value + '=' + ans);
}
function over(){
var ans = form.notwo.value / form.none.value;
alert(form.notwo.value + '/' form.none.value+ '=' + ans);
}
</script>
<style>
h1{font-color: red;}
body{ background-color: aquamarine;}
</style>
<!DOCTYPE html>
<html>
<head><title> JAVAcalc </title></head>
<body>

<h1> The Java Calculator </h1>
<form name="me">
Enter all of the textfields required and click the button to use an operation.<br>
First number: <input type = "textbox" name="none" id="none"value="0">
Second number: <input type = "textbox" name="notwo" id="none" value="0"><br>
<input type = "button" name="none" value="Add!" onclick="add()" onmouseover="a()">
<input type = "button" name="none" value="Subtract!" onclick="subtract()" onmouseover="b()">
<input type = "button" name="none" value="Multiply!" onclick="times()" onmouseover="c()">
<input type = "button" name="none" value="Divide!" onclick="over()" onmouseover="d()">

</body>
</html>

提前致谢!祝你有美好的一天!

【问题讨论】:

  • 我投票决定将此问题作为离题结束,因为 Stack Overflow 不是“为我编写代码”网站。
  • "您能否插入其他三角函数按钮(例如 sin、cos、tan)?" 是的 "还有什么代码有问题吗?” 有什么问题吗?仅供参考:JavaScript 不是 Java
  • 首先,代码永远不会运行。 =(

标签: javascript calculator


【解决方案1】:

您的代码由于其中的错误而无法运行。

alert(form.notwo.value + '/' form.none.value+ '=' + ans);

例如错过了一个“+”,应该是这样的:

alert(form.notwo.value + '/' + form.none.value+ '=' + ans);

还有更多类似的,但我相信你会自己找到它们。

接下来尝试为您的两个数字输入字段提供一个 ID 并获取如下值:

var ans = document.getElementById('ID of your input').value + document.getElementById('ID of your input'.value;

鼠标悬停的效果应该删掉,很烦人 ;-) 要检查未来的 JS 错误,请使用浏览器开发者工具中的控制台(通常是 F12)

【讨论】:

  • 但是,重要的是,如果您将鼠标悬停在按钮上,它会提醒用户该功能。
【解决方案2】:

代码:

<script type="text/javascript">
function a(){
alert('Adds the two numbers.');}
function b(){
alert('Subtracts the second number from the first number.');}
function c(){
alert('Multiplies the two numbers.');}
function d(){
alert('Divides the second number from the first number.');}
function e(){
alert('First number = opposite; Second number = hypotenuse; Finds the sine ratio.');}
function f(){
alert('First number = adjacent; Second number = hypotenuse; Finds the cosine ratio.');}
function g(){
alert('First number = opposite; Second number = adjacent; Finds the tangent ratio.');}
function h(){
alert('First number = hypotenuse; Second number = adjacent; Finds the cosecant ratio.');}
function i(){
alert('First number = hypotenuse; Second number = opposite; Finds the secant ratio.');}
function j(){
alert('First number = adjacent; Second number = opposite; Finds the cotangent ratio.');}
function plus(){
var ans = (me.y.value*1) + (me.x.value*1);
alert(me.x.value + '+' + me.y.value + '=' + ans);
}
function subtract(){
var ans = me.y.value - me.x.value;
alert(me.y.value + '-' + me.x.value+ '=' + ans);
}
function times(){
var ans = me.x.value * me.y.value;
alert(me.x.value + '*' + me.y.value + '=' + ans);
}
function over(){
var ans = me.y.value / me.x.value;
alert(me.y.value + '/' + me.x.value+ '=' + ans);
}
function sine(){
var ans = Math.sin(me.x.value , me.y.value);
alert('The answer is ' + ans + '.');
}
function cosine(){
var ans = Math.cos(me.x.value , me.y.value);
alert('The answer is ' + ans + '.');
}
function tangent(){
var ans = Math.tan(me.x.value , me.y.value);
alert('The answer is ' + ans + '.');
}
function cosecant(){
var ans = 1/Math.sin(me.x.value , me.y.value);
alert('The answer is ' + ans + '.');
}
function secant(){
var ans = 1/Math.cos(me.x.value , me.y.value);
alert('The answer is ' + ans + '.');
}
function cotangent(){
var ans = 1/Math.tan(me.x.value , me.y.value);
alert('The answer is ' + ans + '.');
}
</script>
<style>
h1{font-color: red;}
body{ background-color: aquamarine;}
section{ -webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;

-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;}

</style>
<!DOCTYPE html>
<html>
<head><title> JAVAcalc </title></head>
<body>
<h1> The Java Calculator </h1>
<form name="me">
Enter all of the textfields required and click the button to use an operation.<br>
First number: <input type = "textbox" name="x" id="none"value="0">
Second number: <input type = "textbox" name="y" id="none" value="0"><br><br><br>
<section>
<input type = "button" name="none" value="Add!" onclick="plus()" onmouseout="a()"><br><br>
<input type = "button" name="none" value="Subtract!" onclick="subtract()" onmouseout="b()"><br><br>
<input type = "button" name="none" value="Multiply!" onclick="times()" onmouseout="c()"><br><br>
<input type = "button" name="none" value="Divide!" onclick="over()" onmouseout="d()"><br><br>
<input type = "button" name="none" value="Sine!" onclick="sine()" onmouseout="e()"><br><br>
<input type = "button" name="none" value="Cosine" onclick="cosine()" onmouseout="f()"><br><br>
<input type = "button" name="none" value="Tangent!" onclick="tangent()" onmouseout="g()"><br><br>
<input type = "button" name="none" value="Secant!" onclick="cosecant()" onmouseout="h()"><br><br>
<input type = "button" name="none" value="Cosecant!" onclick="secant()" onmouseout="i()"><br><br>
<input type = "button" name="none" value="Cotangent!" onclick="cotangent()" onmouseout="j()"><br><br>

</section>
</form>
</body>
</html>

【讨论】: