微信小程序点击移除添加class（点击改变背景颜色和字体颜色）

来源：互联网发布：什么刻录软件最好用编辑：程序博客网时间：2024/06/16 06:53

微信小程序不允许DOM操作，所以不能用addClass这种方法，我的用法如下。

点击元素后，获取元素中data-select值，赋值给catalogSelect，然后判断二者是否相等，一样则添加class（class的css可以先写好）。

源码下载：http://download.csdn.net/download/dknightl/9939872

这里写图片描述

    <!--页面-->    <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>

//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      })    }})

阅读全文

2 0