微信小程序获取inpu的值怎么弄？

　　之前小编介绍过的关于微信小程序获取inpu的值是通过小程序form表单获取的，但是更多的开发是需要单个inpu的值，那么微信小程序获取单个inpu的值要怎么做呢?该怎么获取呢?

　　微信小程序是没有document对象的，所以获取单个input的值，不能通过document去抓取input的元素对象再获取元素的值。

　　微信对input的组件，提供了多个事件，看来只能通过这些事件去实现单个input的值的获取。

　　bindblur ，失去焦点事件，e.detail.value取的这个对象的值。大家console.log其他事件的对象，会发现都会有detail这个属*。表单中的数据就是存入这个属*中。另外还有一个target的属*，可以在元素添加data-id属*在元素中去保存一些值，这个在某些地方还是很有用的，比如处理tab切换的时候。

　　好了，具体看我小程序项目中的这个实例吧。简单描述一下功能：输入手机号，点击获取验证码。我必须在点击那个获取验证按钮之前，在js中获取手机号。

　　项目图：

　　js代码：

　　//page中添加属*(事件)

　　mobileInputEvent:function(e){

　　this.setData({

　　mobile:e.detail.value

　　})

　　},

　　verifyCodeEvent:function(e){

　　if(this.data.buttonDisable) return false;

　　var that = this;

　　var c = 60;

　　var intervalId = setInterval(function(){

　　c = c-1;

　　that.setData({

　　verifyCodeTime:c + 's后重发',

　　buttonDisable:true

　　})

　　if(c==0){

　　clearInterval(intervalId);

　　that.setData({

　　verifyCodeTime:'获取验证码',

　　buttonDisable:false

　　})

　　}

　　},1000)

　　var mobile = this.data.mobile;

　　var regMobile = /^1d{10}$/;

　　if(!regMobile.test(mobile)){

　　wx.showToast({

　　title:'手机号有误!'

　　})

　　return false;

　　}

　　app.sendVerifyCode(function(){},mobile);//获取短信验证码接口

　　}

　　xml代码：

　　手机号:

　　短信验证码:

　　{{verifyCodeTime}}

　　ok，以上就是通过获取短信验证码的实例，来更好的理解微信小程序中单个表单值获取的应用。

　　由于微信开发的IDE测试和真机测试有些出入,当初在这个例子中进行小程序测试的时候没有发现一个问题。

　　bindblur在这个例子中是有缺陷的，如果用户输入完直接点击按钮，e.detail.value这个值为空，也就是没获取到输入的值。用这个事件应该是让用户先失去焦点后，再点获取小程序按钮，这样是没问题的。但是用户的行为是没法预测的，使用bindblur不太妥当。所以这里的bindblur可替换为 bindinput 事件，表示获取实时输入的数据。上面的列子只要把xml bindblur改为bindInput即可，其他不变。

　　以上就是关于微信小程序获取inpu的值的全部内容，大家看完以后可以对照相关代码自己开发一次，应该很容易就能成功了，更多资料大家可以关注微信小程序商店。

　　微信小程序获取二维码的流程详解

　　怎样实现微信小程序获取手机号?

　　微信小程序获取用户id的两种方案