在微信开发中我们经常会用到标签中属性的属性值,有时候我们通过 data-* 和 e.target.dateset 来获取属性值会出现一点小bug,即是调用出来的数据是undefined。

  1)方案1–去掉驼峰式命名,纯小写

<--HTML写法:-->
<button binTap="buy" data-textId="101"></button>
//JS调用:
buy:function(e){
console.log(e.target.dataset.textId);
//输出结果:undefined
}

  很多人可能会像我我一样卡在这里了,怎么找都找不到原因,怎么更改都是undefined。 
  其实,很简单! 
  那就是data后面的属性名写得不规范!在data后面的属性名是不能按照驼峰式的写法,只要把定义的属性名全部换成小写就没有问题了!如下:

<--HTML写法:-->
<button binTap="buy" data-productid="101"></button>
//JS调用:
buy:function(e){
console.log(e.target.dataset.productid);
//输出结果:101
}

  但这种方式有时也会存在 e.target.dataset={},此时productid=undefined,就需要换一种解决办法。。。

  2)console.log(e)查看

  e对象中包含两个对象分别是currentTarget和target,而真正的数据包含在currentTarget。 打印出e,找到你的数据,通过对象调用的方式即可。

 <view class="section-item-cell" bindtap="wxSortPickerViewItemTap" data-text="{{cell.platformId}}">
<image class="logo" mode="{{item.mode}}" src="{{cell.iconUrl}}"></image>
<text>{{cell.platformName}}</text>
<text wx:if="{{cell.status==0}}" style="color:#999;">(系统维护中...)</text>
</view>
</view>
 wx.setStorageSync('platId', e.currentTarget.dataset.text);

相关文章:

http://www.zhangxinxu.com/wordpress/2011/06/html5%E8%87%AA%E5%AE%9A%E4%B9%89%E5%B1%9E%E6%80%A7%E5%AF%B9%E8%B1%A1dataset%E7%AE%80%E4%BB%8B/

使用e.target.dataset的问题的更多相关文章

  1. ie9及以下不兼容event.target.dataset对象

    ie9及以下不兼容event.target.dataset对象,请使用event.target.getAttribute('data-xxx')

  2. event.target.dataset

    dataset并不是典型意义上的JavaScript对象,而是个DOMStringMap对象,DOMStringMap是HTML5一种新的含有多个名-值对的交互变量. 1.event.target.d ...

  3. 小程序踩坑之获取不到e.target.dataset的值

    在页面与js传值中我们经常用到data-id="1"的方式,然后通过e.target.dataset.id取id的值今天在获取值时怎么也取不到,后来发现e对象有currentTar ...

  4. 微信开发e.target.dataset取值undefined

    替换为: e.currentTarget.dataset.current

  5. 偶遇event.target

    今天在学习其他人代码的时候见到了event.target.nodeName,event.target.dataset.刚开始是一头雾水,便google一下.发现大多数给出的词条都是有关jQuery事件 ...

  6. event.target的第一次

    今天在学习其他人代码的时候见到了event.target.nodeName,event.target.dataset.刚开始是一头雾水,便google一下.发现大多数给出的词条都是有关jQuery事件 ...

  7. 微信小程序 --- e.currentTarget.dataset.id 获取不到值

    直接代码 wxml代码片段 <view class='ranksList' wx:for="{{ranksLb}}"> <view class='ranksLis ...

  8. 深入理解dataset及其用法

    DataSet是ADO.NET的中心概念.可以把DataSet当成内存中的数据库,DataSet是不依赖于数据库的独立数据集合.所谓独立, 就是说,即使断开数据链路,或者关闭数据库,DataSet依然 ...

  9. change事件传值方式 data-set 以及复杂数据类型 可以动态创建对象push到数组里面

    <template>   <div>     <!-- <div class="banner">       <a-breadcru ...

随机推荐

  1. 图片验证码给AI使用

    为了破解图形验证码,AI需要大量的图片数据.为了简单获取大量的图形来喂给Ai模型训练,索性自己写一把.代码来一发..   import java.awt.Color; import java.awt. ...

  2. mysql字符串拼接,存储过程

    添加字段: alter table `user_movement_log`Add column GatewayId int not null default 0 AFTER `Regionid` (在 ...

  3. idea 常用设置

    1.修改为Eclipse快捷键 File -> Settings -> Keymap => Keymaps改为 Eclipse copy   2.显示行号: File -> S ...

  4. 安装一个apk文件源代码

     /**   * 安装一个apk文件   *   * @param file   * 要安装的完整文件名   */  protected void installApk(File file) {   ...

  5. webpack使用时可能出现的问题

    1.在配置完webpack.config.js准备进行热加载开发时,修改React内容浏览器不会自动局部刷新,而且会console出一些提示: The following modules couldn ...

  6. windows下网络命令----Tracert命令详解

    现在网络四通八达,网线光纤基站卫星,只要运营商能收费的地方,就有网络,覆盖了全世界所有的区域.彻底改变了以前通讯基本靠吼的情况.那么宽广的网络世界,超过100米就得需要中继放大信号的网线,即使现在的光 ...

  7. golang交叉编译笔记

    GOOS:目标平台的操作系统(darwin.freebsd.linux.windows) GOARCH:目标平台的体系架构(386.amd64.arm) Mac 下编译 Linux 和 Windows ...

  8. 去西交大考PAT认证

    这周六去了西交大去考浙大PAT认证,为什么要写这个博客呢.因为...我不是西交大的学生,找考场就花了我很多时间,各种搜都找不到PAT的考场在哪. 在此记录一下,希望有有缘人再去西交大考试,可以少走点弯 ...

  9. PAT——乙级1015/甲级1062:德才论

    这两个题是一模一样的 1015 德才论 (25 point(s)) 宋代史学家司马光在<资治通鉴>中有一段著名的“德才论”:“是故才德全尽谓之圣人,才德兼亡谓之愚人,德胜才谓之君子,才胜德 ...

  10. c# 对List<T> 某字段排序,取TOP条数据

    //排序的对象里的字段数据准备 try { cmr.v4 = Double.Parse(cmr.v3) - Double.Parse(cmr.v2); } catch (Exception e) { ...