微信小程序input框输入值获取
2023-02-18 16:30:16 时间
提交表单时获取输入框的值
wxml
<view>
<!-- 携带 form 中的数据触发 submit 事件 -->
<form bindsubmit="submit">
<input value="{{ age }}" name="age"></input>
<!--
form-type用于form组件 点击会触发form的submit或reset事件
合法值:submit 提交表单 reset重置表单
-->
<button form-type="submit"></button>
</form>
</view>
js
Page({
data: {
age: ''
},
//表单提交时触发
submit(e) {
console.log(e.detail.value);
//e.detail.value获取到的是一个对象 通过每个输入框设置的name属性获取值
//例如e.detail.value.age
}
})
实时更新输入框的值
效果图
wxml
<view>{{value}}</view>
<!-- bindinput:键盘输入时触发 -->
<input bindinput="oninput"></input>
js
Page({
data: {
value: '默认值'
},
//键盘输入时触发事件
oninput(e) {
this.setData({
value: e.detail.value
})
}
})
相关文章
- 网站在线客服系统源码 | 全渠道在线客服代码下载 (最新版支持外贸商城/H5/小程序/公众号对接)
- 前端vue2+vue-router3+ElementUI+axios综合使用代码教程登录页案例
- 在线客服系统对接微信小程序(客服消息推送)
- 【小程序】同一微信号在微信开发工具上怎么切换小程序
- 【小程序】微信公众号模板消息跳转小程序发送失败:errcode=40013 , errmsg=invalid appid rid:
- 【小程序】微信小程序报错47001 - data format error hint
- 【小程序】微信小程序报错:用户绑定的手机需要进行验证,请在客户端完成短信验证
- 【小程序】微信小程序设置globalData全局数据
- 【小程序】获取手机号报错:getPhoneNumber:fail no permission
- 【小程序】小程序webview不支持打开非业务域名请重新配置
- 【uniapp】uniapp微信小程序开发:启动微信开发者工具提示no such file or directory错误
- 【小程序】uniapp发行微信小程序上传失败Error: Error: {"errCode":-10008,"errMsg":"invalid ip
- 【小程序】如何获取微信小程序代码上传密钥?
- [前端] 前端bootstrap col-xs-6 col-md-3的布局意思
- 解放重复劳动丨华为云IoT API Explorer对接小程序实现系统化应用
- [小程序] 支付宝小程序使用list时提示元素不存在
- [javascript] 支付宝小程序网络GET请求
- [PHP] laravel框架注意bootstrap/cache
- [日常] 小白来装机基本概念BIOS与硬盘分区
- [小程序]微信小程序获取位置展示地图并标注信息