但是比你要的这个复杂一些你可以参考一下：
<style type="text/css">
.calculator{width:160pxheight:180pxborder:1px solid #ccc}
.calculator h1{font-size:12pxfont-weight:boldbackground-color:#cccpadding:0margin:0height:20pxline-height:20px}
.calculator input{width:140pxheight:20pxmargin:2px 4px}
.calculator table{width:100%}
.calculator table button{width:100%height:100%}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" >
function Calculator(){
this.a = null
this.b = null
this.symbol = null
//状态：0代表等待输入第一个数，1代表输入了操作符，2代表等待输入第2个数
this.status = 0
this.$div = $("<div class=\"calculator\"><h1>计算器</h1></div>")
this.$input = $("<input type=\"text\" value=\"0\">").appendTo(this.$div)
this.$table = $("<table><tbody></tbody></table>").appendTo(this.$div)
var btns = [
["+","-","*","/"],
["9","8","7","0"],
["4","5","6","C"],
["1","2","3","="]
]
for(var i=0i<btns.lengthi++){
var $tr = $("<tr></tr>")
for(var j=0j<btns[i].lengthj++){
$tr.append($("<td></td>").append(
$("<button type=\"button\">"+btns[i][j]+"</button>").click({"cal":this,"cmd":btns[i][j]},function(e){
e.data["cal"].command(e.data["cmd"])
})
))
}
this.$table.find(">tbody").append($tr)
}
this.operations = {
"+":function(a,b){return parseInt(a,10)+parseInt(b,10)},
"-":function(a,b){return parseInt(a,10)-parseInt(b,10)},
"*":function(a,b){return parseInt(a,10)*parseInt(b,10)},
"/":function(a,b){return parseInt(a,10)/parseInt(b,10)}
}
this.command = function(str){
var inputtext = this.$input.val()
if((/[0-9]/.test(str))){//输入数字时
if(this.status == 1 ){
this.$input.val(str)
this.status = 2
}else{
if(this.$input.val()=="0"){
this.$input.val(str)
}else{
this.$input.val(inputtext+str)
}
}
}else if(/[\+\-\*\/]/.test(str)){//输入加减乘除时
if(this.status == 0){
this.a = inputtext
this.symbol = str
this.status = 1
}else if(this.status==1){
this.symbol = str
}else if(this.status==2){
this.b = inputtext
var val = this.operations[this.symbol](this.a,this.b)
this.$input.val(val+"")
this.status = 1
this.a = val
this.symbol = str
}
}else if(str=="C"){//输入清空时
this.a = null
this.b = null
this.symbol = null
this.status = 0
this.$input.val("0")
}else if(str=="="){//输入等于时
if(this.status==2){
this.b = inputtext
var val = this.operations[this.symbol](this.a,this.b)
this.$input.val(val+"")
this.status = 0
this.a = val
}
}
}
}
$(function(){
var myCal = new Calculator()
$("#aaa").append(myCal.$div)
})
</script>
<div id="aaa"></div>
function test(){var txt1 = document.getElementById("txt1"),
txt2 = document.getElementById("txt2"),
txt3 = document.getElementById("txt3"),
opt = document.getElementById("sel")
txt3.value = eval(txt1.value + opt.value + txt2.value)//eval函数可计算某个字符串，并执行其中的的js代码
} <input type="text" id="txt1" />
<select id="sel">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" id="txt2" />
=
<input type="text" id="txt3" />
<input type="button" id="btn" value="计算" onclick="test()"/>
用 表单提交 或者超链接 或者 AJAX传递文本框内输入的数字FormBean
int a //输入数1
int b //输入数2
String operator// 运算符
Action里面
先判断运算符 在调用相应的方法进行处理 返回页面
如果需要保留 用户输入的数字可以用ajax实现 或者Html标签实现
简单点就用Ajax实现
