小程序如何获取input标签的值

本篇文章给大家介绍一下微信小程序获取input标签值的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

获取微信小程序中input中的数据

<scroll-view>
    <view id='titleView'>
        <text id="titleText">登录</text>
    </view>
    <view id='mainView'>
        <text>用户名</text>
        <input class='input' bindinput='usernameInput'></input>
        <text>密码</text>
        <input class='input' bindinput='passwordInput'></input>
        <button class="btn" bindtap='login'>登录</button>
        <button class='btn' bindtap='toRegister'>注册</button>
    </view>
</scroll-view>

登录的js页面

var app=getApp();
Page({
login:function(e){
<!--拼接url通过后台验证跳转
this.data.username获取标签中值-->
    var url = app.globalData.serverIp +"/user/login.html?"
    +"username="+this.data.username
    +"&password="+this.data.password;
    <!--为this赋值给全局对方法中调用-->
    var page=this;
    <!--用request进行后台传输-->
    wx.request({
        url: url,
        success:function(response){
            var serverData=response.data;
            var status=serverData.status;
            var msg="登录失败";
            if(status==200){
                msg="登录成功";
                //跳转商场首页navigateTo
                wx.navigateTo({
                    url:"../storeindex/storeindex",
                })
                //把username保存到手机上
                //sync表示同步 setStorageSync函数的作用是同步保存数据相当于http中的cookie
                wx.setStorageSync("username", page.data.username);
            }
            wx.showToast({
                title: msg
            })
        },
        fail:function(e){
            console.log("联网失败");
            console.log(e);
        },
         
        data: {
            username:"",
            password:""
        },
        usernameInput:function(e){
            this.data.username=e.detail.value;
        },
        passwordInput: function (e) {
            this.data.password = e.detail.value;
        },
    })
},