小程序動(dòng)態(tài)改變字體顏色

因?yàn)樾〕绦蚶锩鏇](méi)有DOM操作,所以不能像JS或者jq一樣,一兩行代碼切換類(lèi)
下面教大家一個(gè)簡(jiǎn)單的方法在小程序中動(dòng)態(tài)改變字體的顏色

方法1:

  • wxml中:
<view class="classname" bindtap="changeColor" style="color:{{color}}">改變顏色</view>  /*創(chuàng)建一個(gè)view標(biāo)簽然后添加bindtap事件*/
  • js中:
Page({
    changeColor:function(){
      var color = this.data.color == "red"?"green":"red";
      this.setData({
        color:color
      })
    }
})

方法2:

  • wxml中:
<view style="color:{{color}};">我會(huì)變色</view>
 <button bindtap="clickRed">變紅</button>
 <button bindtap="clickgreen">變綠</button>
  • js中:
Page({
   data:{
       color:"red"
    }
   clickRed: function () {
     this.setData({
      color: "red"
     })
   },
   clickgreen: function () {
     this.setData({
       color: "green"
     })
   }
})
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容