index.wxml
<!--index.wxml-->
<!--页面根标签-->
<view class="content">
<!--pics文件夹下的background.jpg文件-->
<image class='background' src="/images/beijing1.jpg" mode="aspectFill"></image>
<!--页面其它部分-->
</view>
<view class="box">
<view class="title">货币兑换</view>
<form bindsubmit="calc" bindreset="reset">
<input name='cels' placeholder='请输入人民币金额' type='number' auto-focus="true"></input>
<input name='meihui' placeholder='美元汇率' type='number' auto-focus="true"></input>
<input name='yinghui' placeholder='英镑汇率' type='number' auto-focus="true"></input>
<input name='ouhui' placeholder='欧元汇率' type='number' auto-focus="true"></input>
<input name='rihui' placeholder='日元汇率' type='number' auto-focus="true"></input>
<view class='btnLayout'>
<button form-type="submit" bindtap='reset'>计算</button> //bindtap='reset' 绑定flag的属性
<button form-type="reset" bindtap='abc'>清除</button> //bindtap='abc' 绑定flag的属性
</view>
<view style='{{flag}}' class="textLayout">
<text>兑换美元为:{{M}}</text>
<text>兑换英镑为:{{Y}}</text>
<text>兑换欧元为:{{O}}</text>
<text>兑换日元为:{{R}}</text>
</view>
</form>
</view>
index.js
//index.js
var C,MH,YH,OH,RH;
Page({
data:{
flag:"visibility: hidden;" //设置隐藏且占位
},
calc: function (e) {
C = parseInt(e.detail.value.cels)
MH= parseInt(e.detail.value.meihui)
YH= parseInt(e.detail.value.yinghui)
OH= parseInt(e.detail.value.ouhui)
RH= parseInt(e.detail.value.rihui)
this.setData({
M: (C / MH).toFixed(4),
Y: (C / YH).toFixed(4),
O: (C / OH).toFixed(4),
R: (C / RH).toFixed(4),
})
},
reset: function () {
this.setData({
M: '',
Y: '',
O: '',
R: '',
flag:"" //取消隐藏
})
},
abc:function () {
this.setData({
flag:"visibility: hidden;" //继续维持隐藏属性
})
}
})