例子，js计算器代码。
<html>
<head>
<title>js版计算器 - www.jb200.com</title>
<link rel="stylesheet" type="text/css" href="">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<!--js代码可以放置在任意位置，按照先后顺序依次执行 一般放在head标签之间-->
<script type="text/javascript">
/* 定义一个calculator类*/
function calculator(){
this.jisuan=function(num1,num2,oper){
var res=0;
switch(oper){
case "+":
res=num1+num2;
break;
case "-":
res=num1-num2;
break;
case "*":
res=num1*num2;
break;
case "/":
res=num1/num2;
break;
}
return res;
}
}
//创建对象
var calculator=new calculator();
/*定义全局变量*/
var val=0; //放置输入的值
var xval=0;//保存转换number类型的值
var temp=0; //保存第一次输入的值
var oper="";//保存输入的操作符
/*获取输入数字*/
function inputevent(e){
val=e.value
var xsval=document.getelementbyid("inp1");
xsval.value+=val; //连续输入数字(string类型)
//转换number类型
xval=parsefloat(xsval.value);
}
/*获取第一行的数据*/
function inputpcb(e){
//window.alert(e.value);
var xsval=document.getelementbyid("inp1");
if(e.value=="clear"){
xsval.value="";
}else if(e.value=="back"){
/*这个功能还没有实现，有兴趣的朋友可以自己做一做*/
}else if(e.value=="power"){
//计算平方
xsval.value=math.pow(xsval.value,2);
}
}
/*输入操作符*/
function inputoper(e){
oper=e.value;
//window.alert(typeof oper);
//oper=oper.substr(0);
if (e.value=="+"){
var xsval=document.getelementbyid("inp1");
//保存上次计算结果，并对字符串进行转换number类型
temp=parsefloat(xsval.value);
//第一次输入的值设置为空
xsval.value="";
}else if(e.value=="-"){
var xsval=document.getelementbyid("inp1");
temp=parsefloat(xsval.value);
xsval.value="";
}else if(e.value=="*"){
var xsval=document.getelementbyid("inp1");
temp=parsefloat(xsval.value);
xsval.value="";
}else if(e.value=="/"){
var xsval=document.getelementbyid("inp1");
temp=parsefloat(xsval.value);
xsval.value="";
}
}
/*计算结果*/
function inputequel(e){
var xsval=document.getelementbyid("inp1");
if(e.value=="="){
//window.alert(xval);
//调用对象方法
xsval.value=calculator.jisuan(temp,xval,oper);
}
}
</script>
<!--css 样式-->
<style>
input{
width:60px;
}
#inp1{
width:280px;
text-align:right;
}
</style>
</head>
<body>
<table border="1">
<!--显示结果行-->
<tr><td colspan="4"><input id="inp1" type="text" value="" name="xianshi"/></td></tr>
<!--第一行-->
<tr><td><input type="button" value="power" onclick="inputpcb(this)"/></td><td><input type="button" value="clear" onclick="inputpcb(this)"/></td><td><input type="button" value="back"onclick="inputpcb(this)"/></td><td></td></tr>
<!--第二行-->
<tr><td><input type="button" value="1" onclick="inputevent(this)"/></td><td><input type="button" value="2" onclick="inputevent(this)"/></td><td><input type="button"value="3" onclick="inputevent(this)"/></td><td><input type="button" value="4" onclick="inputevent(this)"/></td></tr>
<!--第三行-->
<tr><td><input type="button" value="5" onclick="inputevent(this)"/></td><td><input type="button" value="6" onclick="inputevent(this)"/></td><td><input type="button"value="7" onclick="inputevent(this)"/></td><td><input type="button" value="8" onclick="inputevent(this)"/></td></tr>
<!--第四行-->
<tr><td><input type="button" value="9" onclick="inputevent(this)"/></td><td><input type="button" value="0" onclick="inputevent(this)"/></td><td><input type="button"value="." onclick="inputevent(this)"/></td><td><input type="button" value="=" onclick="inputequel(this)"/></td></tr>
<!--第五行-->
<tr><td><input type="button" value="+" onclick="inputoper(this)"/></td><td><input type="button" value="-" onclick="inputoper(this)"/></td><td><input type="button"value="*" onclick="inputoper(this)"/></td><td><input type="button" value="/" onclick="inputoper(this)"/></td></tr>
</table>
</body>
</html>
js计算器，效果图：
