《PHP程序設(shè)計(jì)與微信小程序案例教程》 課件2.6制作“比較成績”js代碼

主講人：譚麗君2.6制作“比較成績”js代碼微信小程序開發(fā)

2.6制作“比較成績”js代碼

1.bjcj.wxml文件中給輸入框添加bindchange事件、按鈕添加bindtap事件，給最后一個view組件內(nèi)容數(shù)據(jù)綁定{{result}}?？蚩虬粹o框文本輸入框文本輸入框文本2

<inputbindchange="yw"></input>13

<buttontype="primary"bindtap="bj">比較成績</button>

<inputbindchange="sx"></input>

<view>比較結(jié)果{{result}}</view>34

2.6制作“比較成績”js代碼

Page({data:{cj1:0,cj2:0,result:'',},步驟1：在bjcj.js文件的Page中的data里給頁面變量賦初值步驟2：在bjcj.js文件的Page中編寫yw事件處理函數(shù)，yw:function(e){this.setData({cj1:Number(e.detail.value)})},e是觸發(fā)事件的組件e.detail.value是獲取用戶輸入的值this.setData是把e.detail.value的值賦值給cj1

2.6制作“比較成績”js代碼

步驟3：在bjcj.js文件的Page中編寫sx事件處理函數(shù)，sx:function(e){this.setData({cj2:Number(e.detail.value)})},e是觸發(fā)事件的組件e.detail.value是獲取用戶輸入的值this.setData是把e.detail.value的值賦值給cj1

2.6制作“比較成績”js代碼

步驟4：在bjcj.js文件的Page中編寫bj事件處理函數(shù)，bj:function(){varstr="成績相等"if(this.data.cj1>this.data.cj2){str="語文成績高"}if(this.data.cj1<this.data.cj2){str="數(shù)學(xué)成績高"}this.setData({result:str})},如果cj1>cj2str的值為語文成績高如果cj1<cj2str的值為數(shù)學(xué)成績高用this.setData函數(shù)把str的值賦值給result給str變量賦值

2.6制作“比較成績”js代碼

優(yōu)化代碼：1.把2個輸入框的綁定事件函數(shù)統(tǒng)一用fs2.分別給2個輸入框添加data-name框框按鈕框文本輸入框文本輸入框文本2

<inputbindchange="fs"data-name="cj1"></input>13

<buttontype="primary"bindtap="bj">比較成績</button>

<inputbindchange="fs"data-name="cj2"></input>

<view>比較結(jié)果{{result}}</view>34

2.6制作“比較成績”js代碼

優(yōu)化代碼：在bjcj.js文件的Page中編寫fs事件處理函數(shù)：fs:function(e){console.log(e)this.data[]=Number(e.deta