html设计如下图所示,要求:在前两个文本框中输入任意数字值,单击相应的运算符按钮后,完成需要的运算。

如题所述

<!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>无标题文档</title>
</head>
<body>
<form>
<div>
<label for="num1"></label>
第一个数:
<input type="text" name="num1" id="num1" />
</div>
<div>
第二个数:
<input type="text" name="num2" id="num2" />
</div>
<div>
<input type="button" name="jia" id="jia" value="+" onclick="operate('jia')" />
<input type="button" id="jian" name="jian" value="-" onclick="operate('jian')" />
<input type="button" name="chen" id="chen" value="X" onclick="operate('chen')"/>
<input type="button" name="chu" id="chu" value="/"onclick="operate('chu')" />
</div>
<div>计算结果:
<input type="text" name="res" id="res" />
</div>
</form>
<script language="javascript">
function operate(n)
{
var num1=Number(document.getElementById("num1").value);
var num2=Number(document.getElementById("num2").value);
if(n=='jia')
{
document.getElementById("res").value=num1+num2;
return;
}
if(n=='jian')
{
document.getElementById("res").value=num1-num2;
return;
}
if(n=='chen')
{
document.getElementById("res").value=num1*num2;
return;
}
if(n=='chu')
{
document.getElementById("res").value=num1/num2;
return;
}
}
</script>
</body>
</html>
温馨提示:答案为网友推荐,仅供参考
相似回答