效果图
代码
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>
操作数1:<input id="Num1" type="text"><br>
操作数2:<input id="Num2"type="text"><br>
运算符:<input type="button" onclick="onclicknum('+')" value="+">
<input type="button" onclick="onclicknum('-')" value="-">
<input type="button" onclick="onclicknum('*')" value="*">
<input type="button" onclick="onclicknum('/')" value="/"><br>
结果:<input type="text" id="jieguo" style="width: 300px;height:80px;font-size:70px;border:0px;" >
</div>
</body>
</html>
js
<script type="text/javascript">
function onclicknum(fuhao){
var n1=document.getElementById("Num1").value;
var n2=document.getElementById("Num2").value;
var s =eval(n1+fuhao+n2);
var result=document.getElementById("jieguo");
result.value=s;
}
</script>