微信小程序-bindtap事件子元素不传参

<ul id="tabBar">
    <li class="{{currentTabBar_s == 10?‘active‘:‘‘}}" data-current="10" bindtap="swichTabN"><image src=‘../../images/icon/tab_MyTodo_s.png‘ class=‘img_s‘></image><image src=‘../../images/icon/tab_MyTodo.png‘ class=‘img_n‘></image><span>待办</span></li>
    <li class="{{currentTabBar_s == 11?‘active‘:‘‘}}" data-current="11" bindtap="swichTabN"><image src=‘../../images/icon/tab_Customers.png‘ class=‘img_n‘></image><image src=‘../../images/icon/tab_Customers.png‘ class=‘img_s‘></image><span>客户</span></li>
    <li class="{{currentTabBar_s == 12?‘active‘:‘‘}}" data-current="12" bindtap="swichTabN"><image src=‘../../images/icon/tab_Find.png‘ class=‘img_n‘></image><image src=‘../../images/icon/tab_Find.png‘ class=‘img_s‘></image><span>发现</span></li>
    <li class="{{currentTabBar_s == 13?‘active‘:‘‘}}" data-current="13" bindtap="swichTabN"><image src=‘../../images/icon/tab_Achieve.png‘ class=‘img_n‘></image><image src=‘../../images/icon/tab_Achieve.png‘ class=‘img_s‘></image><span>业绩</span></li>
  </ul>

  

 // 点击标题切换当前页时改变样式
  swichTabN: function (e) {
    var _this=this;

   var cur = e.target.dataset.current;

  //点击li的子级元素,不进行值改变,解决方法把取值方式  由e.target.dataset.current;  修改为e.currentTarget.dataset.current即可

    var cur = e.currentTarget.dataset.current;
    console.log(_this.data.currentTabBar_s)
    console.log(_this.data)
    if (this.data.currentTabBar_s == cur) { console.log(123);return false; }
    else {
      console.log(5687)
      this.setData({
        currentTabBar_s: cur
      })
    }
  },

  

原文地址:https://www.cnblogs.com/jiayeyuan/p/8432407.html

时间: 2024-11-05 21:46:22

微信小程序-bindtap事件子元素不传参的相关文章

h5页面与微信小程序之间的跳转、传参

h5跳小程序: <script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script> 原帖链接: https://blog.csdn.net/mytljp/article/details/81902305 原文地址:https://www.cnblogs.com/chenmoumou/p/10538645.html

微信小程序bindtap事件

bindtap就是点击事件 在wxml文件下 <button type="primary" bindtap="btnclick"> {{btnText}} </button> 在js文件下 Page({ /** * 页面的初始数据 */ data: { text : "这里是内容" , btnText : "这里是按钮", }, /** * 生命周期函数--监听页面加载 */ onLoad: funct

微信小程序Dom事件实现

面对微信小程序,可能没有像我们平时使用JQuery那样随心所欲.本篇就是为了解决这个问题. 请合理使用工具! 细节就不说了,直接备份一个实现的案例: wxml <view class="guess" > <view> <image data-data_auto = "{{ac[index]}}" data-index="{{index}}" data-num="1" data-id="{

微信小程序页面事件-下拉刷新,上拉加载更多

1.下拉刷新的概念及应用场景. 概念: 下拉刷新是移动端更新列表数据的交互行为,用户通过手指在屏幕上子上而下的滑动,可以触发页面的下拉刷新,更新列表数据. 应用场景: 在移动端,数据列表是常见的页面效果,更新列表数据是最基本的页面需求,相比于按钮刷新,定时刷新来说,下拉刷新的用户体验方便友好,已经成为移动端刷新列表数据的最佳解决方案. 微信小程序启动下拉刷新: 两种方式: 1.需要在app.json 的window选项中或页面配置中开启enablePullDownRefresh, 但是,一般情况

微信小程序之动态获取元素宽高

我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuery() 这个api接口,以前的某些问题就能得到解决了... 那么,这个api接口怎么用呢? 首先,这个接口会返回一个对象实例. var obj=wx.createSelectorQuery(); 下面的就是返回的对象实例 obj 的所有内容. 返回的 obj 有五个方法: 1.  obj.in(component):没用过这个方法,多用于组件的选择器. 2.   obj.select

微信小程序实现多张图片同时上传的方法

对于微信小程序上传图片其实很麻烦的,每次只能上传一张,所有很多朋友就会问想要多张图片上传怎么办?这里使用递归,当上传完一张图片后重新执行这个函数,直到所有的图片都上传完成后,就不再调用该函数了.具体的实现方法来为大家分享一下.示例代码如下: wx.chooseImage({success: function(res) {var tempFilePaths = res.tempFilePathswx.uploadFile({url: 'http://example.weixin.qq.com/up

微信小程序选择视频,视频上传,视频播放

请查看链接地址看具体详情: 选择视频: https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-video.html#wxchoosevideoobject 视频上传时和图片上传是一个道理需要使用小程序的上传模版:(将选择视频的链接传给后台,后台将链接转换成后台存储的路径) https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-file.html#wxuploadfileobject 视频播放:

原创:微信小程序bindtap绑定html元素点击事件

什么是事件? 事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 详解(以常见的tap点击事情为例) 模板.wxml代码: <view id="tapTest" data-hi="WeChat" bindtap="tapName"> Click me! </view> JS文件代码: Page({ data:{ ... }, onload:function(){ ... }, tapName: f

微信小程序bindtap点击事件与事件冒泡

原文链接:https://www.cnblogs.com/lhm166/articles/9947383.html 事件冒泡就是指嵌套事件发生,如果多层标签嵌套, 里层事件发生后, 其外层会相应发生, 如: <view bindtap='handout'> outer <view bindtap='handmiddle'> middle <view bindtap='handinner'>inner</view> </view> </vie