1.wxml中

<view class="column">
<view class="body-view {{num==1?'active':''}}" bindtap="bindChoice" data-num='1'>推荐</view>
<view class="body-view {{num==2?'active':''}}" bindtap="bindChoice" data-num='2'>热门</view>
<view class="body-view {{num==3?'active':''}}" bindtap="bindChoice" data-num='3'>分类</view>
</view>
2.js中
data{
   num:1
}
bindChoice:function(e){
   console.log(e);
   this.setData({
        num:e.target.dataset.num
})
}

小程序点击事件改变样式(普通js鼠标点击事件)的更多相关文章

  1. js 鼠标和键盘事件

    js 鼠标和键盘事件 鼠标事件 聚焦事件 离焦事件 鼠标单击和双击 鼠标的其他事件 鼠标事件对象 键盘事件 鼠标事件 聚焦事件 <input type="text" id=& ...

  2. js鼠标划过事件

    js鼠标划过事件一般有两对 onmouseover/onmouseout onmouseenter/onmouseleave 区别: 1.onmouseover/onmouseout 鼠标经过自身会触 ...

  3. 微信小程序radio组件 - 如何改变默认样式大小?

    今天在写小程序的时候用到radio组件,但是很懊恼并未提供修改radio组件大小属性,第一感觉准备用css width , height 改变radio的大小,但是怎么搞也无法改变. 但是又不愿意搞个 ...

  4. 微信小程序实现显示和隐藏控件-头像-取值-bindblur事件

    微信小程序实现显示和隐藏控件 .wxml: <view class=" {{showOrHidden?'show':'hidden'}}"></view> ...

  5. 微信小程序 text属性设置 WXSS样式

    >微信小程序的布局css样式 参考自  珺L 文字 width: fit-content;font-size:20px;      /*设置文字字号*/color:red;           ...

  6. 小程序获取地址授权的修改 wx.openSetting需点击

    开发者可以通过 wx.openSetting 接口来打开小程序设置界面并返回用户的设置结果.在原来的 wx.openSetting 接口中,我们允许开发者直接调用此接口,但目前我们发现有不少开发者滥用 ...

  7. 小程序echarts数据不改变,或者是一次渲染成功,第二次进入,渲染失败的解决办法

    1.引入echarts插件: import * as echarts from '../../ec-canvas/echarts'; 2.data中定义: ecBar: { onInit: initC ...

  8. 微信小程序入门四: 导航栏样式、tabBar导航栏

    实例内容 导航栏样式设置 tabBar导航栏 实例一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { & ...

  9. 微信小程序尺寸单位rpx以及样式相关介绍

    rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375p ...

随机推荐

  1. CodeForces 430A Points and Segments (easy)(构造)题解

    题意:之前愣是没看懂题意...就是给你n个点的坐标xi,然后还规定了Li,Ri,要求给每个点染色,每一组L,R内的点红色和黑色的个数不能相差大于1个,问你能不能染成功,不能输出-1,能就按照输入的顺序 ...

  2. RocketMQ3.2.2生产者发送消息自动创建Topic队列数无法超过4个

    问题现象 RocketMQ3.2.2版本,测试时尝试发送消息时自动创建Topic,设置了队列数量为8: producer.setDefaultTopicQueueNums(8); 同时设置broker ...

  3. Flyway Overview and Installation

    https://flywaydb.org/documentation/ Flyway is an open-source database migration tool. It strongly fa ...

  4. hash进阶:使用字符串hash乱搞的姿势

    前言 此文主要介绍hash的各种乱搞方法,hash入门请参照我之前这篇文章 不好意思hash真的可以为所欲为 在开头先放一下题表(其实就是我题解中的hash题目qwq) 查询子串hash值 必备的入门 ...

  5. (转) GAN论文整理

    本文转自:http://www.jianshu.com/p/2acb804dd811 GAN论文整理 作者 FinlayLiu 已关注 2016.11.09 13:21 字数 1551 阅读 1263 ...

  6. ES6模块化操作

    在ES5中我们要进行模块化操作需要引入第三方类库,随着前后端分离,前端的业务日渐复杂,ES6为我们增加了模块化操作.模块化操作主要包括两个方面. export :负责进行模块化,也是模块的输出. im ...

  7. Jenkins参数化构建(二)之 Maven command line使用Jenkins参数

    安装Extened Choice Parameter插件 General模块选择‘参数化构建过程’   3. maven command line中使用 clean test -DsuiteXmlFi ...

  8. CSS3动画详解(结合实例)

    一.使用CSS3动画代替JS动画 JS动画频繁操作DOM导致效率非常低 在频繁的操作DOM和CSS时,浏览器会不停的执行重排(reflow)和重绘(repaint) 可以避免占用JS主线程 这边就不细 ...

  9. JavaSE习题 继承接口和泛型

    问答题: 1.子类在什么情况下可以继承父类友好成员? 答:在同一个包内 2.子类通过怎样的方法可以隐藏继承的成员变量? 答:声明一个与父类相同变量名的成员变量 3.子类重写继承的方法原则是什么? 答: ...

  10. pom.xml文件

    最近在了解maven创建的工程,拿到服务器的一段代码一直报错,是maven的pom.xml文件出错了,但是不知道是什么原因,所以就想知道pom.xml文件的作用及内容. 什么是POM? POM是项目对 ...