学堂学堂学堂公众号手机端

JavaScript可以实现网页计算器的功能，以下是一个简单的示例： <!DOCTYPEhtml> <html> <

lewis 1年前 (2024-02-02) 阅读数 3 #技术

JavaScript可以实现网页计算器的功能，以下是一个简单的示例：

<!DOCTYPEhtml>
<html>
<head>
<title>网页计算器</title>
</head>
<body>
<h1>网页计算器</h1>

<inputtype="text"id="input"readonly>
<br>
<buttononclick="clearInput()">C</button>
<buttononclick="appendInput('+')">+</button>
<buttononclick="appendInput('-">-</button>
<buttononclick="appendInput('*">*</button>
<buttononclick="appendInput('/')">/</button>
<br>
<buttononclick="appendInput('7')">7</button>
<buttononclick="appendInput('8')">8</button>
<buttononclick="appendInput('9')">9</button>
<buttononclick="calculate()">=</button>
<br>
<buttononclick="appendInput('4')">4</button>
<buttononclick="appendInput('5')">5</button>
<buttononclick="appendInput('6')">6</button>
<buttononclick="appendInput('('">(</button>
<buttononclick="appendInput(')')">)</button>
<br>
<buttononclick="appendInput('1')">1</button>
<buttononclick="appendInput('2')">2</button>
<buttononclick="appendInput('3')">3</button>
<buttononclick="appendInput('.')">.</button>
<br>
<buttononclick="appendInput('0')">0</button>

<script>
functionappendInput(value){
document.getElementById('input').value+=value;
}

functioncalculate(){
letexpression=document.getElementById('input').value;
try{
letresult=eval(expression);
document.getElementById('input').value=result;
}catch(error){
alert('输入表达式无效，请重新输入');
}
}

functionclearInput(){
document.getElementById('input').value='';
}
</script>
</body>
</html>

在这个示例中，我们创建了一个简单的网页计算器，用户可以在输入框中输入表达式，然后点击“=”按钮进行计算。计算器支持基本的加减乘除运算，同时也可以清除输入框中的内容。通过JavaScript的eval函数来计算输入表达式的结果。如果输入的表达式无效，会弹出一个提示框提示用户重新输入。

版权声明

本文仅代表作者观点，不代表博信信息网立场。

上一篇：在SQL中，CONVERT函数用于将一个数据类型转换为另一个数据类型下一篇：在Java中，可以使用Arrays类的sort方法对二维数组进行排序