小程序点击时获取当前元素的id

最新推荐文章于 2024-04-21 14:15:16 发布
最新推荐文章于 2024-04-21 14:15:16 发布
阅读量1.7k 收藏
点赞数 1
分类专栏： 小程序 文章标签： 小程序 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_51614564/article/details/124115311
版权

之前我是这么写的，

但是会给提示这些错误，

Component "pages/newgift/newgift" does not have a method "radioChanges(items.id)" to handle event "tap".

大概意思就是：组件“pages/newgift/newgift”没有一个方法“radioChanges(goodsitem.id)”来处理事件“tap”。

在网上参考了其他大佬的方案：

给当前元素加上一个自定义属性：data-id

 

这样我们就可以实现在点击时拿到当前元素的id 啦。

 

 

要成为光的女人
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序开发-点击事件，获取元素id
Dove言和
03-01 1万+
1、点击事件，获取元素id，页面传值 不是专业程序员，突然就想研究一下微信小程序的开发，开发一个实时的菜价系统小程序，新手一个，什么都不懂，就从0开始，想着写个博客把遇到的问题和解决的办法一点点的写下来吧。 首先遇到的问题就是参数传递； 小程序里的点击触发事件、如何获取当前元素的id、如何吧值传递到下一个页面例： <view class="kindleft"> &...
微信小程序——获取绑定事件元素的ID
03-29
小程序list数据带值跳转，一般直接通过设置item的id来标识或者通过设置键值data-xxxx的方式标识。如下图所示： (此图片来源于网络，如有侵权，请联系删除! )   解析出来的结果如下图： (此图片来源于网络，如有侵权，请联系删除! )   我们看到它在元素上绑定了一个checkSchoolLogin事件，触发这个事件时需要获取该元素的id值，我们如何获取呢？ 先不急着知道方法，我们先用下面的方法看它点击的时候返回了一些什么数据： (此图片来源于网络，如有侵权，请联系删除! )   如下图所示，点击之后发现e里面带有这些属性，我们可以看到 currentTarget下面有个id, d
微信小程序点击元素获取当前元素的值
wxqwxq123444的博客
08-16 1762
微信小程序点击元素获取当前元素的值
JavaScript之DOM(一)(获取元素、事件基础、操作元素），2024年最新字节跳动前端岗经典面试真题
最新发布
始飞龙
04-21 800
网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。需要这份系统化的资料的朋友，可以添加V获取：vip1024c （备注前端）一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！[外链图片转存中…(img-RhJe2tDA-1713680105869)]
微信小程序点击时如何获取当前id
weixin_45966674的博客
07-27 4309
wxml 千万不要省略掉看着没用的data-bid 解决这个问题它才是关键 js 这样我们就可以看到对应的组件id了
微信获得点击元素的内容_微信小程序中利用DOM获取页面元素的信息
weixin_39838302的博客
12-21 1144
在js中，我们常常用到类似 $("#id") 这样的代码获得一个页面元素对象 但是在微信小程序中是不支持的，那么我们难免有时候会需要这样一个方法去拿到想要的对象，如下：//首先给你的元素对象一个id：//然后在js里，用一个SelectorQuery来选择对应id的节点(注意id前面要加一个#号)，就可以获取对应节点的属性，包括高度。//创建节点选择器varquery=wx.cre...
小程序带值跳转 点击获得item元素的属性id或键值标识
03-29
小程序list数据带值跳转，一可以直接通过设置item的id来标识或者通过设置键值data-xxxx的方式标识 设置id的方法标识跳转 在要跳转的item处，设置一个id并给当前的id赋值上对应的key值，比如一部电影的id（后面带着id...
小程序实现列表删除功能
11-26
本文实例为大家分享了小程序列表删除功能的具体代码，供大家参考，具体内容如下 地址簿删除，先获取当前地址部分的id值，根据id值来删除对应的地址部分。 获取全部的地址信息，定义一个空的数组newallData，用来...
javascript模仿百万格子小的一小段代码
10-30
我们首先获取了一个 ID 为 "aa" 的元素，然后使用 innerHTML 属性将表格字符串设置到该元素中。该表格字符串是使用 JavaScript 生成的，我们使用了两个 for 循环来生成 100 行 50 列的表格。 在生成每个单元格时，...
Python程序设计试题库.doc
10-02
Python 中可以使用 len() 函数获取列表、元组、字典、集合、字符串以及range 对象中元素个数。 25. Python 内置函数 max() 用来返回序列中的最大元素。 Python 中可以使用 max() 函数返回序列中的最大元素。 26...
Font Inspector-crx插件
04-01
此外，还有有关当前选项卡的信息，例如id，宽度，高度，标题和URL。 如果单击工具栏图标或按键盘上的“退出”按钮，则页面内用户界面将消失，页面内的所有链接均正常运行。 要报告错误，请填写插件首页...
微信小程序实现动态获取元素宽高的方法分析
11-26
本文实例讲述了微信小程序实现动态获取元素宽高的方法。分享给大家供大家参考，具体如下： 我以前一直以为微信小程序不能动态获取view元素的宽高。但是自从看到： wx.createSelectorQuery() 这个api接口，以前的某些问题就能得到解决了。。。 那么，这个api接口怎么用呢？ 首先，这个接口会返回一个对象实例。 var obj=wx.createSelectorQuery(); 下面的就是返回的对象实例 obj 的所有内容。 返回的 obj 有五个方法： 1.  obj.in(component)：没用过这个方法，多用于组件的选择器。 2.  obj.select(sele
微信小程序点击按钮获取数据（wx：for）
qq_51632935的博客
08-10 4803
微信小程序点击按钮获取响应的数据
小程序：获取元素节点信息
weixin_44727080的博客
07-26 7289
小程序中，获取元素的节点信息来做一些操作。
does not have a method “switchChange“ to handle event “change“【已解决】
qq_46616532的博客
03-02 1673
来自：微信小程序之开发遇到 does not have a method “xxxx“ to handle event “tap“ 问题的解决方案【已解决】出现这个错得到时候我很郁闷，百度了好几种方法都没有效果，直到，我看了眼我的js文件，。发现是我写错页面js了，，，一定要细心，，，，
小程序获取值的几种方法
weixin_44600235的博客
05-24 1845
Wxml: 获取wxml id里面的值 <viewclass="item{{currentTab==0?'active':''}}"bindtap="check"id="top" data-id="0"> 头条 </view> <viewclass="item{{currentTab==1?'active':''}}"bindtap="check"id="yule"data-id="1"> 娱乐 </vi...
小程序获取元素信息
weixin_42040328的博客
11-14 1537
小程序获取元素的宽和高
[DOM]获取元素：根据ID、标签名、HTML5新增的方法、特殊元素获取
「 虚幻私塾」
09-11 2344
目录*+++
微信小程序开发1-点击事件,获取元素id
热门推荐
zhou_hao_yan的博客
04-01 2万+
    本人也是刚接触小程序开发，总之碰到了很多坑.在后续的的实践中我会一点一点地把自己遇到的问题与解决方案记录下来，希望能给大家带来帮助.言归正传，进入主题    今天要介绍的是小程序开发中常见的一种情况——点击列表中的某一行跳转到新的页面并将该行的详细信息显示出来    话不多说先上代码： xxx.wxml中的代码-里面的样式用的是有赞提供的开源样式库,感兴趣的可以去了解一下   &lt;vi...
微信小程序 获取当前在 scroll-view 内的 元素
05-11
要获取当前在 `scroll-view` 内的元素，可以使用 `scroll-view` 的 `scroll-into-view` 属性和 `bindscrolltoupper/bindscrolltolower` 事件来实现。 首先，在需要滚动到的元素上设置一个唯一的 `id`，例如： ```html <scroll-view scroll-y="true" scroll-into-view="{{currentId}}" bindscrolltoupper="upper" bindscrolltolower="lower"> <view id="element1">第一个元素</view> <view id="element2">第二个元素</view> <view id="element3">第三个元素</view> <view id="element4">第四个元素</view> <view id="element5">第五个元素</view> <view id="element6">第六个元素</view> <view id="element7">第七个元素</view> <view id="element8">第八个元素</view> <view id="element9">第九个元素</view> </scroll-view> ``` 然后在js中，定义一个 `currentId` 变量来存储当前在可视区域内的元素的 `id`，并在 `bindscrolltoupper/bindscrolltolower` 事件中获取当前可视区域内最顶部的元素和最底部的元素的 `id`，从而更新 `currentId` 变量。具体代码如下： ```javascript Page({ data: { currentId: 'element1' // 默认为第一个元素的id }, upper: function (e) { // 获取当前可视区域内最顶部的元素的id wx.createSelectorQuery().selectViewport().scrollOffset(function(res){ wx.createSelectorQuery().selectAll('.element').boundingClientRect(function(rects){ rects.forEach(function(rect){ if(rect.top <= res.scrollTop){ this.setData({ currentId: rect.id }) } }) }).exec() }).exec() }, lower: function (e) { // 获取当前可视区域内最底部的元素的id wx.createSelectorQuery().selectViewport().scrollOffset(function(res){ wx.createSelectorQuery().selectAll('.element').boundingClientRect(function(rects){ rects.forEach(function(rect){ if(rect.bottom >= res.scrollTop + res.height){ this.setData({ currentId: rect.id }) } }) }).exec() }).exec() } }) ``` 这样，当用户滚动 `scroll-view` 时，就会根据当前可视区域内最顶部或最底部的元素的 `id` 来更新 `currentId` 变量，从而得到当前在可视区域内的元素。注意，要在需要滚动到的元素上设置 `class="element"`，以便于在 `selectAll` 方法中选中所有元素。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值