小程序button获取input内容
时间: 2024-09-16 12:04:55 浏览: 59
微信小程序 input输入框详解及简单实例
在微信小程序中,如果你想通过Button元素获取Input框的内容,你可以按照以下步骤操作:
1. 首先,在WXML文件中,创建一个Input输入框和一个Button按钮,给它们关联相应的ID以便在JavaScript中引用它们:
```html
<input type="text" id="myInput">
<button bindtap="handleGetContent">获取内容</button>
```
2. 然后,在对应的JS文件中,定义一个函数`handleGetContent`,当用户点击按钮时,这个函数会被触发:
```javascript
Page({
data: {
inputValue: ''
},
handleGetContent: function() {
this.setData({
inputValue: wx.createSelectorQuery()
.select('#myInput')
.fields({
selector: 'input',
properties: ['value']
})
.exec()[0].value // 获取input的值
});
}
})
```
这里我们使用了WeApp提供的`wx createSelectorQuery()` API 来查询并获取Input的值。
阅读全文