微信小程序获取button按钮的值：data-xxx

最新推荐文章于 2025-06-17 09:13:46 发布
最新推荐文章于 2025-06-17 09:13:46 发布
阅读量4.9k 收藏 4
点赞数 3
CC 4.0 BY-SA版权
分类专栏： 微信小程序 文章标签： 小程序 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_41286138/article/details/105235884
本文介绍在wxml中如何利用button标签的data-xxx属性向js文件传递参数，并解释了在js中如何通过特定方式获取这些参数。此方法不仅适用于button标签，还广泛应用于其他场景。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

wxml中的button标签向js文件中传送值，可以通过data-xxx属性实现，xxx可以自定义。
在这里插入图片描述
在js文件中通过如下方式获取：
在这里插入图片描述
该方式是通用的，不仅仅只是运用于button标签。

微信小程序开发中的表单提交与数据验证
吃不胖.
06-16 468
通常，表单会包含一些输入框、单选框、复选框等表单元素，用户在填写完表单后，需要点击提交按钮来触发表单提交操作。在"form"文件夹下创建一个新的文件，命名为"form.wxml"，用于编写表单的结构。在"form"文件夹下创建一个新的文件，命名为"form.wxss"，用于编写表单的样式。在"form"文件夹下创建一个新的文件，命名为"form.js"，用于编写表单的逻辑。在"pages"文件夹下创建一个新的文件夹，命名为"form"。在小程序的根目录下创建一个新的文件夹，命名为"pages"。
【微信小程序】小程序隐私保护指引设置
疾术客
08-29 5822
涉及处理用户个人信息的小程序开发者，需通过弹窗等明显方式提示用户阅读隐私政策等收集使用规则。 为规范开发者的用户个人信息处理行为，保障用户合法权益，微信要求开发者主动同步微信当前用户已阅读并同意小程序的隐私政策等收集使用规则，方可调用微信提供的隐私接口。
微信小程序怎么点击按钮获取button里面的值
热门推荐
信徒博客
01-29 1万+
第一种情况：button里面的值------------数据绑定 wxml代码如下 <view> <button bindtap="getv" name="bu">{{mess}}</button> </view> js代码如下 var meData='中国' Page({   /** * 页面的初始数据 */ data: {...
微信小程序开发Js获取button的值并实时显示在input上
weixin_52563089的博客
10-20 1117
html代码 方式一 <button bindtap="numBtn" class="bt" data-text="1">1</button> 方式二 <view hover-class="bg" bindtap="numBtn" data-val="1">1</view> JS代码 方式一 var num = e.target.dataset.text 方式二 var num = e.target.dataset.val
微信小程序中Button组件的属性值和用法详解
ike_kenny的博客
05-31 3211
简要介绍Button组件在小程序中的作用和重要性，以及为什么开发者需要深入了解其属性值和用法。size：设置按钮尺寸大小。type：设置按钮样式类型。plain：设置按钮是否镂空。disabled：设置按钮是否禁用。open-type：设置按钮的开放能力。hover-class：设置按钮按下后的样式类。form-type：设置按钮在表单中的功能类型。lang：设置开放能力的语言类型。hover-stop-propagation：设置是否阻止事件冒泡。
微信小程序获取输入框内容的方法
wwz123124的博客
08-01 3663
1.bindinput 2.bindsubmit 携带 form 中的数据触发 submit 事件 bindsubmit 事件需要配合按钮的formType="submit"操作 设置input的name值来获取对应的数据 <form bindsubmit='loginForm'> <text class='login-title'>用户登录：</te...
微信小程序实战-第7章 小程序开发框架
andyyah晓波的博客
07-17 933
-- 在此处编写的内容将会插入到组件slot中 -->示例内容自定义组件案例：我是第{{item}}项
微信小程序按钮去除边框线分享页面功能
12-02
在上述场景中，用户遇到了一个问题：如何使用美工提供的分享按钮图片，并且去除微信小程序中`button`组件的边框线，同时保持分享功能的正常工作。下面将详细讲解这个问题的解决方案以及相关的知识点。 首先，微信小...
微信小程序实现下载进度条的方法
11-29
在微信小程序中，为了提供更好的用户体验，特别是在涉及文件下载或者数据加载时，通常需要展示一个下载进度条。本文将详细讲解如何在小程序中实现这一功能，利用微信小程序内置的`progress`组件，来创建具有实时反馈...
微信小程序二维码生成
忙碌的菠萝
06-17 1317
该接口用于获取小程序码，适用于需要的码数量较少的业务场景。通过该接口生成的小程序码，永久有效，有数量限制，详见。POST。
微信小程序--获取通过data-* 穿的值
qq_36935391的博客
12-21 5917
parseInt(res.currentTarget.dataset.index); JSON.stringify(jsonstr);//可以将json对象转换成json对符串 JSON.parse(jsonstr); //可以将json字符串转换成json对象 var str='1250' ; Number(str) ; //得到1250 parseInt(str); //...
提供个小程序，得到按键值的，做小游戏啥的用
纷舞年华的专栏
10-26 708
#include //#include #include using namespace std; short int getkey()//得到按键值 { union key { unsigned short int value; unsigned char ch[2]; } key1; key1.value =0; w
获取button中value值的方法
weixin_55367649的博客
03-16 1458
获取4</button><button id="btn3">获取3</button><button id="btn1">获取1</button><button id="btn1">获取2
微信小程序中点击一个按钮获取文本框中的值
qq_41619567的博客
12-19 1万+
HTML &lt;input bindinput="talk" /&gt; &lt;button bindtap="oks"&gt;确认&lt;/button&gt; JS talks:function(e){ this.setData({ talks:e.detail.value }) }...
微信小程序中text和button的用法的介绍
zhao123456asd的博客
04-12 1145
1.对于text的用法，通过添加selectable属性，再点击预览后，通过微信扫码,在手机界面， 通过长按，可以直接复制。 2.对于rich-text的用法，通过nodes属性，可以把html中的直接渲染成wxml格式的，效果如下 示例代码： 效果图: 对于微信小程序button的用法, 1.在button添加type=primary表示是主色条格式。 2.在button添加type=warn表示是警告格式的 3.在button里添加size=mini表示是小格式按钮 4.在but.
如何获取＜button＞上的文字
周小东
01-23 3241
有两bai种情况： 第一种：这du个button是个 元素zhi的话那dao么获取这个zhuanbutton的值就是 var buttonValue= document.getElementById(‘button’).value; 第二种：这个button是个 button 元素的话那么获取这个button的值就是 var buttonValue= document.getElementById(‘button’).innerHTML; 或者： var buttonValue= document.ge
小程序如何获取data- 的值、事件传参的方式
m0_66051368的博客
06-14 3881
dataset
jQuery Mobile中按钮button的data-*选项
全栈工程师开发手册（原创）https://github.com/tencentmusic/cube-studio
08-31 3560
全栈工程师开发手册 （作者：栾鹏） jQuery Mobile 所有data-*选项jQuery Mobile中按钮button的data-*选项//在1.4 版本以后已废弃。使用 CSS 类 替代带有 data-role="button" 的超链接。button 元素、工具栏中的链接以及 input 字段都会自动渲染成按钮样式，不需要添加 data-role="button"。//data-cor
微信小程序js程序怎么获取data变量
最新发布
07-12
我们正在讨论微信小程序的JS中如何获取data数据。根据引用[2]和引用[4]，我们可以总结出几种方法。 引用[2]提到，在事件处理函数中，可以通过`currentTarget.dataset`来获取通过`data-`属性传递的数据。但是，这里...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值