js php计算器编程,js 计算器实现

计算器

body{

width: 600px;

margin: 80px auto 0 auto;

}

#xian{

width: 580px;

border: 1px solid #f2f2f2;

height: 70px;

background: #f2f2f2;

border-radius: 5px;

text-align: right;

font: 35px/2 "bodoni mt black";

padding: 0 8px;

}

.jian{

width: 145px;

background: #f2f2f2;

display: inline-block;

height: 45px;

margin: 5px 0;

font: 600 20px/45px "courier new";

text-align: center;

cursor: pointer;

}

.jian:hover{

background: #e2e2e2;

}

.jian:active{

background: #d2d2d2;

}

+

-

*

/

1

2

3

4

5

6

7

8

9

0

00

.

>

ce

=

var lishi='';

var zong='';

var yun='';

var clear=false;

$('#shuzi div').click(function(){

if(clear){

$('#xian').text('');

clear=false;

}

window.zong=$('#xian').text();

var dian=$(this).text();

if(dian=='.' && window.zong.indexOf('.') != -1){

return false;

}

window.zong = String(window.zong) + dian;

$('#xian').text(window.zong);

});

$('.yun').click(function(){

if(lishi=='' && yun == ''){

window.linshi=$('#xian').text();

yun=$(this).text();

}else{

switch(yun){

case '+':

window.linshi=Number(linshi) + Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

case '-':

window.linshi=Number(linshi)-Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

case '*':

window.linshi=Number(linshi)*Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

case '/':

window.linshi=Number(linshi)/Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

}

}

clear=true;

});

$('#deng').click(function(){

switch(yun){

case '+':

window.linshi=Number(linshi) + Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

case '-':

window.linshi=Number(linshi)-Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

case '*':

window.linshi=Number(linshi)*Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

case '/':

window.linshi=Number(linshi)/Number($('#xian').text());

yun=$(this).text();

$('#xian').text(Number(window.linshi));

break;

}

});

$('#qing').click(function(){

window.linshi='';

yun='';

$('#xian').text('');

});

$('#tui').click(function(){

var s=String(window.zong);

s=s.substring(0,s.length-1);

$('#xian').text(s);

window.zong=s;

});