免费国产欧美国日产_少妇AV一区二区三区无码_蜜桃精品av无码喷奶水小说_jk18禁网站视频_精产国品一二三级产品区别_被夫の上司に犯波多野结衣_78m成人手机免费看_最爽最刺激18禁视频_偷偷色噜狠狠狠狠的777米奇

易優(yōu)GEO 重磅上線 ~ 一站式GEO優(yōu)化工具,讓豆包、文心一言、DeepSeek 在回答中主動推薦你的品牌,搶占AI流量入口!  點擊查看

小程序模板網(wǎng)

微信小程序點擊移除添加class(點擊改變背景顏色和字體顏色)

發(fā)布時間:2017-12-26 12:03 所屬欄目:小程序開發(fā)教程

微信小程序不允許DOM操作,所以不能用addClass這種方法,我的用法如下。點擊元素后,獲取元素中data-select值,賦值給catalogSelect,然后判斷二者是否相等,一樣則添加class(class的css可以先寫好)。 !--頁面-- v ...

 
 
 

微信小程序不允許DOM操作,所以不能用addClass這種方法,我的用法如下。

點擊元素后,獲取元素中data-select值,賦值給catalogSelect,然后判斷二者是否相等,一樣則添加class(class的css可以先寫好)。

這里寫圖片描述

    
    <view class="info_choose ">
        <view class="catalog_name">花色view>

        <view class="catalog_items display-flex-row" >
          <block wx:for="{{catalogs}}">
            <text data-select="{{item.select}}" class="{{item.select == catalogSelect ? 'active':''}} catalog_item" bindtap="chooseCatalog">{{item.catalogName}}text>
          block>
        view>
    view>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

//js代碼

Page({
    data: {

        catalogs:[
          { "catalogName": "卡其卡其",
            "select":1          
          },
          {
            "catalogName": "其卡其卡卡其卡其",
            "select": 2
          },
          {
            "catalogName": "鯉魚鯉魚",
            "select": 3
          },
          {
            "catalogName": "神跡神跡卡其卡其",
            "select": 4
          },  

        ],
        catalogSelect:0,//判斷是否選中
    },

    chooseCatalog:function(data){
      var that=this;
      that.setData({//把選中值放入判斷值
        catalogSelect : data.currentTarget.dataset.select
      })


    }
})


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://www.szcjxy.com/wxmini/doc/course/18260.html 復制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢: 點擊咨詢
在線客服