gpt4 book ai didi

Javascript/HTML 计算器,结果需要其他方法

转载 作者:搜寻专家 更新时间:2023-10-31 08:40:04 25 4
gpt4 key购买 nike

我在上中学,我们现在正在学习 HTML 和 javascript。我正在制作一个计算器(在互联网的帮助下),我发现了 eval() 函数。我们基本上还没有学到,所以我需要将其更改为其他内容。这是我的计算器的代码:

<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Számológép</title>
</head>

<body>
<script>
function beker(szam) {
document.szamologep.eredmeny.value = document.szamologep.eredmeny.value + szam;
}
function szamol() {
var a = document.szamologep.eredmeny.value;
if (a) {
document.szamologep.eredmeny.value = eval(a)
}
}
</script>

<h2 align="center">Számológép!</h2>
<form name="szamologep">
<table border="2" align="center">
<tr>
<td colspan="4"><input type="text" name="eredmeny"/></td>
</tr>
<tr>
<td><input type="button" value="1" onclick="beker(1)"/></td>
<td><input type="button" value="2" onclick="beker(2)"/></td>
<td><input type="button" value="3" onclick="beker(3)"/></td>
<td><input type="button" value="+" onclick="beker('+')"/></td>
</tr>
<tr>
<td><input type="button" value="4" onclick="beker(4)"/></td>
<td><input type="button" value="5" onclick="beker(5)"/></td>
<td><input type="button" value="6" onclick="beker(6)"/></td>
<td><input type="button" value="-" onclick="beker('-')"/></td>
</tr>
<tr>
<td><input type="button" value="7" onclick="beker(7)"/></td>
<td><input type="button" value="8" onclick="beker(8)"/></td>
<td><input type="button" value="9" onclick="beker(9)"/></td>
<td><input type="button" value="*" onclick="beker('*')"/></td>
</tr>
<tr>
<td><input type="reset" value="C"/></td>
<td><input type="button" value="0" onclick="beker(0)"/></td>
<td><input type="button" value="=" onclick="szamol()"/></td>
<td><input type="button" value="/" onclick="beker('/')"/></td>
</tr>
</table>
</form>
</body>

</html>

所以我需要在 szamol() 中使用其他方法。

我们制作了另一个带有单选按钮的计算器。我也添加了代码,这样您就可以看到我们学到了什么。

<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Névtelen 1</title>
<script>
function szamol()
{
var a=parseInt(document.urlap.szam1.value);
var b=parseInt(document.urlap.szam2.value);
var e=0;
if(document.urlap.muvelet[0].checked)e=a+b;
if(document.urlap.muvelet[1].checked)e=a-b;
if(document.urlap.muvelet[2].checked)e=a*b;
if((document.urlap.muvelet[3].checked) &&(b!=0))e=a/b;
if((document.urlap.muvelet[3].checked) &&(b==0))e="Nullával nem osztunk";

if(document.urlap.muvelet[4].checked)
{
e=1;
for(i=1;i<=b;i++)

e=e*a;
}
document.urlap.eredmeny.value=e;
}
</script>
</head>

<body>
<form name="urlap">
<table>
<tr>
<td>Szam1<input type="number" name="szam1" value="0">
<td>Szam2<input type="number" name="szam2" value="0">
</tr>
<tr>
<td>Összeadás<input type="radio" name="muvelet" checked>
Kivon<input type="radio" name="muvelet">
Szoroz<input type="radio" name="muvelet">
Oszt<input type="radio" name="muvelet">
Hatvany<input type="radio" name="muvelet">
</tr>
<tr>
<td><input type="button" value="OK" onclick="szamol()">
<td><input type="reset" value="Reset">
</tr>
<tr>
<td>Eredmény:<input type="text" name="eredmeny">
</tr>
</table>

</form>
</body>

</html>

最佳答案

继续 comment left by Nikos M.您需要一种方法来确定您使用的是哪个运算符。下面的代码将仅说明一个运算符,但如果您只需要涵盖这些内容,它就会满足您的要求。

为了澄清上面的粗体文本,这将适用于看起来像这样的表达式:

X + Y , X - Y , X * Y , 和 X / Y .

但不适用于以下表达式:

X + Y + Z , X * Y + Z / P等等

function szamol() {
var a = document.szamologep.eredmeny.value;
if (a) {
var answer;
var split = a.split(/([+,\-,*,\/]){1}/g);
console.log('Split: ' + split);
var first = Number(split[0]);
var operator = String(split[1]);
var second = Number(split[2]);
switch(operator){
case '+':
answer = first + second;
break;
case '-':
answer = first - second;
break;
case '*':
answer = first * second;
break;
case '/':
answer = first / second;
break;
}
document.szamologep.eredmeny.value = answer;
}
}

我们设置空 answer变量,然后我们拆分 a任何运算符的值 +, -, *, \使用正则表达式。我们的第一个元素split是第一个数字,我们的 split 的第二个元素是我们的运算符,也是我们 split 的第三个元素是第二个数字。

在我们有了我们的作品之后,我们创建了一个 switch检查我们正在使用哪个运算符的案例,并根据它进行数学计算。因为输入是文本输入 - JavaScript 假设我们正在使用字符串 - 这就是为什么我必须 typecast firstsecond变量为 Number()设置它们时。

关于Javascript/HTML 计算器,结果需要其他方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53305328/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com