小程序如何获取页面上input值

在小程序开发中，我们经常需要获取页面上的input值。这篇文章将介绍如何实现获取input值的方法。

1.获取input值的基本方法

获取input值的基本方法是使用小程序提供的API。我们可以通过wx.getStorageSync或wx.getStorage方法获取本地存储中的input值，也可以通过页面的data绑定实现获取input值：

使用wx.getStorageSync：

constinputValue=wx.getStorageSync('inputValue');

使用wx.getStorage：

wx.getStorage({key:'inputValue',success:function(res){console.log(res.data)}})

使用data绑定：

Page({data:{inputValue:''},//输入框内容改变时触发bindInputValue(e){this.setData({inputValue:e.detail.value})}})

2.获取页面中多个input值

当页面中存在多个input时，我们可以通过name属性来获取对应的input值：

//html代码<inputtype=textname=name1/><inputtype=textname=name2/>//获取input值constname1=e.detail.value.name1;constname2=e.detail.value.name2;

3.获取radio和checkbox的值

对于radio和checkbox等多选框，我们需要使用wx.createSelectorQuery来获取选中的值：

wx.createSelectorQuery().selectAll('input[type=radio]').fields({dataset:true,value:true},res=>{console.log(res)}).exec();

其中，selectAll选择器选择所有的radio元素，fields方法指定需要获取的属性，res即为返回的结果。

以上就是小程序如何获取页面上input值的方法。希望本文能够帮助到大家。