• 微信小程序-form表单-获取用户输入文本框的值


    微信小程序-form表单-获取用户输入文本框的值

    <input name='formnickname' class="textarea" placeholder="{{geren.nickname}}" value='{{geren.nickname}}' bindinput="nickname" maxlength='15' auto-height/>
    
      // 获取昵称
      nickname: function(e) {
        this.setData({
          nickname: e.detail.value,
        })
        console.log("昵称" + this.data.nickname);
      },
      // 获取姓名
      realName: function(e) {
        this.setData({
          realName: e.detail.value,
        })
        console.log("姓名" + this.data.realName);
      },
      // 获取详细地址
      detailAddress: function(e) {
        this.setData({
          detailAddress: e.detail.value,
        })
        console.log("详细地址" + this.data.detailAddress);
    
        this.setData({
          detailAddress: e.detail.value,
        })
        console.log("详细地址" + this.data.detailAddress);
      },
      保存
      baocun: function(e) {
        console.log("昵称:" + this.data.nickname + " 真实姓名:" + this.data.realName + "性别:" + this.data.sex + "详细地址" + this.data.detailAddress);
      },
    
    <input class="input" name="userName" placeholder="请输入用户名"
        bindinput ="userNameInput"/>
     
    <input class="input" name="password" placeholder="请输入密码"
         bindinput="passWdInput" />
    
    <button class="loginBtn" bindtap="loginBtnClick">登录</button>
    
    data: {
        userName: '',
        userPwd:""
      },
      //获取用户输入的用户名
      userNameInput:function(e)
      {
        this.setData({
          userName: e.detail.value
        })
      },
      passWdInput:function(e)
      {
        this.setData({
          userPwd: e.detail.value
        })
      },
      //获取用户输入的密码
      loginBtnClick: function (e) {
        console.log("用户名:"+this.data.userName+" 密码:" +this.data.password);
      }
    

    form表单

    <form bindsubmit="formSubmit" bindreset="formReset">
        <view class='item'>
          
    
    
    
    
    
    
    昵称:
          <view class='bk'>
            <!-- <textarea class="textarea" placeholder='昵称' auto-height value='{{geren.nickname}}' maxlength='15'></textarea> -->
            <input name='formnickname' class="textarea" placeholder="{{geren.nickname}}" value='{{geren.nickname}}' bindinput="nickname" maxlength='15' auto-height/>
          </view>
        </view>
    
        <view class='item'>
          真实姓名:
          <view class='bk'>
            <!-- <textarea class="textarea" placeholder='真实姓名' auto-height value='{{geren.sysUserDetail.realName}}' maxlength='10'></textarea> -->
            <input name='formrealName' class="textarea" placeholder="{{detailgeren.realName}}" value='{{detailgeren.realName}}' bindinput="realName" maxlength='15' auto-height/>
    
          </view>
        </view>
    
        <view class='item'>
          
    
    
    
    
    
    
    性别:
          <radio-group class="radio-group" bindchange="radioChange" name='formsex'>
    
            <!-- <label class="radio" wx:for="{{items}}"> -->
            <label class='radio'>
              <!-- checked="{{item.checked}}" -->
              <radio value="{{items[0].name}}" checked='{{boy}}' /> {{items[0].value}}
              <radio value="{{items[1].name}}" checked='{{gril}}' /> {{items[1].value}}
            </label>
    
          </radio-group>
        </view>
    
        <view class='item'>
          
    
    
    
    
    
    
    生日:
          <view class='bk'>
            <view class='time'>
              <picker mode="date" value="{{date}}" start="1800-01-01" end="2222-01-01" bindchange="changeDate" name="formdate">
                <view>
                  {{date}}
                </view>
              </picker>
            </view>
          </view>
        </view>
    
        <view class='item'>
          
    
    
    
    居住地:
          <view class='bk'>
            <!-- <textarea class="textarea" placeholder='居住地' auto-height value='{{geren.sysUserDetail.address}}' maxlength='10'></textarea> -->
            <view class="tui-picker-content">
              <picker name="formaddress" bindchange="changeRegin" mode="region" value="{{region}}">
                <!-- <view class="tui-picker-detail">{{region[0]}} - {{region[1]}} - {{region[2]}}</view> -->
                <view class="tui-picker-detail">{{region}}</view>
              </picker>
            </view>
    
          </view>
        </view>
    
        <view class='item'>
          详细地址:
          <view class='bk'>
            <!-- <textarea class="textarea" placeholder='详细地址' auto-height value='{{geren.sysUserDetail.detailAddress}}' maxlength='100'></textarea> -->
            <input name="formdetailAddress" class="textarea" placeholder="{{detailgeren.detailAddress}}" value='{{detailgeren.detailAddress}}' bindinput="detailAddress" maxlength='100' auto-height/>
    
          </view>
        </view>
    
        <!-- <button class='btn' bindtap='baocun'>保存</button> -->
        <view class='anniu'>
          <button class='btn' formType="submit">保存</button>
          <button class='btn' formType="reset">重置</button>
        </view>
    
      </form>
    
    formSubmit: function (e) {
        console.log('form发生了submit事件,携带数据为:', e.detail.value);
      },
    
    let app = getApp();
    Page({
      data: {
        phone: "",
        pwd: "",
    
        sex: "男"
      },
      formSubmit: function (e) {
        console.log('form发生了submit事件,携带数据为:', e.detail.value);
        let { phone, pwd, isPub, sex } = e.detail.value;
    
        this.setData({
          warn: "",
          isSubmit: true,
          phone,
          pwd,
          isPub,
          sex
        })
      },
      formReset: function () {
        console.log('form发生了reset事件')
      }
    })
    
  • 相关阅读:
    传Windows 7 RC泄露版中含有木马 狼人:
    金山:3G时代 上网安全面临更大挑战 狼人:
    McAfee:僵尸网新威胁远甚Conficker 狼人:
    安全专家:70GB财务数据被僵尸网络盗窃 狼人:
    卡巴斯基中国地区4月恶意软件排行榜 狼人:
    MPAA组织遭遇尴尬 网页存在XSS攻击漏洞 狼人:
    股市回暖 网上炒股安全风险骤增 狼人:
    微软首次针对Windows 7推杀毒软件 年内将推出 狼人:
    黑客数度入侵美国联邦航空总署飞航控制系统 狼人:
    瑞星对Windows7捆绑杀毒软件等消息的回应 狼人:
  • 原文地址:https://www.cnblogs.com/dashucoding/p/11932408.html
Copyright © 2020-2023  润新知