使用e.target.dataset的问题
在微信开发中我们经常会用到标签中属性的属性值,有时候我们通过 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的问题的更多相关文章
- ie9及以下不兼容event.target.dataset对象
ie9及以下不兼容event.target.dataset对象,请使用event.target.getAttribute('data-xxx')
- event.target.dataset
dataset并不是典型意义上的JavaScript对象,而是个DOMStringMap对象,DOMStringMap是HTML5一种新的含有多个名-值对的交互变量. 1.event.target.d ...
- 小程序踩坑之获取不到e.target.dataset的值
在页面与js传值中我们经常用到data-id="1"的方式,然后通过e.target.dataset.id取id的值今天在获取值时怎么也取不到,后来发现e对象有currentTar ...
- 微信开发e.target.dataset取值undefined
替换为: e.currentTarget.dataset.current
- 偶遇event.target
今天在学习其他人代码的时候见到了event.target.nodeName,event.target.dataset.刚开始是一头雾水,便google一下.发现大多数给出的词条都是有关jQuery事件 ...
- event.target的第一次
今天在学习其他人代码的时候见到了event.target.nodeName,event.target.dataset.刚开始是一头雾水,便google一下.发现大多数给出的词条都是有关jQuery事件 ...
- 微信小程序 --- e.currentTarget.dataset.id 获取不到值
直接代码 wxml代码片段 <view class='ranksList' wx:for="{{ranksLb}}"> <view class='ranksLis ...
- 深入理解dataset及其用法
DataSet是ADO.NET的中心概念.可以把DataSet当成内存中的数据库,DataSet是不依赖于数据库的独立数据集合.所谓独立, 就是说,即使断开数据链路,或者关闭数据库,DataSet依然 ...
- change事件传值方式 data-set 以及复杂数据类型 可以动态创建对象push到数组里面
<template> <div> <!-- <div class="banner"> <a-breadcru ...
随机推荐
- 从PRISM开始学WPF(一)WPF-更新至Prism7.1
原文:从PRISM开始学WPF(一)WPF-更新至Prism7.1 我最近打算学习WPF ,在寻找MVVM框架的时候发现了PRISM,在此之前还从一些博客上了解了其他的MVVM框架,比如浅谈WPF中的 ...
- onenet基础通信套件返回+CIS ERROR: 50的问题解决
1. 场景分析,主要问题就是有些操作返回+CIS ERROR: 50 2. 看了一下在AT+MIPLOBSERVERSP这个指令里面是没有返回+CIS ERROR: 50的错误类型的,所以应该是在解析 ...
- Putty的设置保存
用了好几年都不知道这功能, 以前每次在连接时只能手工更改字符为utf-8,当时在想怎么这么弱呢 后来才知道... 1 字符 Translation下 字体Appearance下 颜色Colours下 ...
- jmeter上传视频图片附件
http上传附件一般用的Content-Type: multipart/form-data;文中是先通过fiddler抓取手机端的请求,然后通过jmeter模拟该请求,如果有接口文档,则可以跳过抓包这 ...
- LAMP架构应用实战—Apache服务介绍与安装01
LAMP架构应用实战—Apache服务介绍与安装01 一:Apache是什么 Apache是Apache基金会开发的一个高性能.功能强大.安全可靠.灵活的开放源码的WEB服务软件 二:Apache ...
- deeplearning.ai课程学习(2)
第二周:神经网络的编程基础(Basics of Neural Network programming) 1.逻辑回归的代价函数(Logistic Regression Cost Function) 逻 ...
- Java 实现一个带提醒的定时器
定时闹钟预览版EXE下载链接:https://files.cnblogs.com/files/rekent/ReadytoRelax_jar.zip 功能说明: 实现了一个休息提醒器,用户首先设定一个 ...
- Failed to start component [StandardEngine[Catalina].StandardHost[localhost].StandardContext[/xxx项目名]]
可能是web.xml中的一些配置导致Tomcat启动失败,把web.xml中除 <welcome-file-list>外的全部配置删除后,就能正常启动Tomact了. 具体什么原因还不清楚 ...
- EXT.NET各个版本下载地址
官网下载地址为:http://www.nuget.org/packages/Ext.NET
- Android调用Java WebSevice篇之二
1.创建Activity. package com.web; import org.ksoap2.SoapEnvelope; import org.ksoap2.serialization.SoapO ...