linux运算器小程序报告,微信小程序 简易计算器实现代码实例

这篇文章主要介绍了微信小程序 简易计算器实现代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

只能进行简单的运算

效果图如下：

cal.wxml

{{result}}

清除

回退

÷

7

8

9

×

4

5

6

-

1

2

3

+

0

.

=

cal.wxss

/* pages/cal/cal.wxss */

page{

background: #000000;

}

.screen{

position: fixed;

color: #ffffff;

font-size: 30px;

bottom: 780rpx;

text-align: right;

width: 730rpx;

word-wrap: break-word;

}

.content{

position: fixed;

bottom: 0;

}

.buttonGroup{

display: flex;

flex-direction: row;

}

.buttonitem{

text-align: center;

line-height: 148rpx;

width: 192rpx;

border-radius: 0;

}

.buttonitem1{

width: 255rpx;

text-align: center;

line-height: 148rpx;

border-radius: 0;

}

icon{

position: absolute;

top: 30rpx;

left: 67rpx;

}

.color1{

background: #CCFF99;

}

.color2{

background: #FFFF99;

}

.color3{

background: rgb(167, 223, 241);

}

.shadow{

background: #88e676;

}

.shadow0{

background: rgb(149, 118, 243);

}

.shadow1{

background: #FFCC66;

}

.shadow2{

background: #99FF00;

}

.shadow3{

background: #FF9999;

}

.shadow4{

background: #00CC66;

}

.shadow5{

background: #00CCFF;

}

.shadow6{

background: rgb(248, 80, 80);

}

.shadow7{

background: #FFCCFF;

}

.shadow8{

background: #CCCCCC;

}

.shadow9{

background: #CCFFFF;

}

cal.js

// pages/cal/cal.js

Page({

data: {

result:"0",

id1:"clear",

id2:"back",

id3:"time",

id4:"div",

id5:"mul",

id6:"sub",

id7:"add",

id8:"dot",

id9:"eql",

id10:"num_0",

id11:"num_1",

id12:"num_2",

id13:"num_3",

id14:"num_4",

id15:"num_5",

id16:"num_6",

id17:"num_7",

id18:"num_8",

id19:"num_9",

buttonDot:false,

},

clickButton: function (e) {

console.log(e);

var buttonVal = e.target.id;

var res = this.data.result;

var newbuttonDot=this.data.buttonDot;

var sign;

if (buttonVal >= "num_0" && buttonVal <= "num_9") {

var num=buttonVal.split('_')[1];

if (res == "0" || res.charAt(res.length -(length-1)) == "=") {

res = num;

}

else {

res = res + num;

}

}

else{

if(buttonVal=="dot")

{

if(!newbuttonDot)

{

res = res + '.';

}

}

else if(buttonVal=="clear")

{

res='0';

}

else if(buttonVal=="back")

{

var length=res.length;

if(length>1)

{

res=res.substr(0,length-1);

}

else{

res='0';

}

}

else if (buttonVal == "div" || buttonVal == "mul" || buttonVal == "sub" || buttonVal == "add")

{

switch(buttonVal){

case "div":

sign ='÷';

break;

case "mul":

sign ='×';

break;

case "sub":

sign='-';

break;

case "add":

sign='+';

break;

}

if(!isNaN(res.charAt(res.length-1)))

{

res=res+sign;

}

}

}

this.setData({

result: res,

buttonDot:newbuttonDot,

});

},

equal: function(e){

var str=this.data.result;

var item= '';

var strArray = [];

var temp=0;

for(var i=0;i<=str.length;i++){

var s=str.charAt(i);

if((s!='' && s>='0' && s<='9') || s=='.'){

item=item+s;

}

else{

strArray[temp]=item;

temp++;

strArray[temp]=s;

temp++;

item='';

}

}

if(isNaN(strArray[strArray.length-1]))

{

strArray.pop();

}

var num;

var res=strArray[0]*1;

for(var i=1;i<=strArray.length;i=i+2){

num=strArray[i+1];

switch(strArray[i]){

case "-":

res = res - num;

break;

case "+":

res = res + num;

break;

case "×":

res = res * num;

break;

case "÷":

if(num!='0')

{

res = res / num;

}

else

{

res ='∞';

break;

}

break;

}

}

this.setData({

result:'='+res,

});

},

time:function(e){

var util=require("../../utils/util.js");

var time=util.formatTime(new Date());

this.setData({

result:time

});

}

})

cal.json

{

"navigationBarBackgroundColor": "#FF9900",

"navigationBarTitleText": "EN计算器",

"usingComponents": {}

}

其中有一些小错误，望大神指正！！！！

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。