小程序获取input的值

来源:csdn博客 分类: 文章浏览史 发布时间:2020-08-31 10:33:57 最后更新:2020-08-31 浏览:66
转载声明:
本文为摘录自“csdn博客”,版权归原作者所有。
温馨提示:
为了更好的体验,请点击原文链接进行浏览
摘录时间:
2020-08-31 10:33:57

微信小程序----日期时间选择器(自定义精确到分秒或时段)

https://www.jianshu.com/p/6369074e83bc  微信小程序-form表单提交

<view class='common_inputbox'>
      <text>姓名:</text>
      <input type='text' name="username" bindinput='usernameInput' value='{{username}}'></input>
    </view>
data: {
    username:'',//用户名
  },

//实时获取数据
usernameInput: function (e) {
    this.setData({
      username: e.detail.value
    })
    console.log(this.data.username)
  },

第二种:
usernameInput: function (e) {
    var username = e.detail.value
    this.setData({
      username: username
    })
    console.log('username',username)
  },

 

form 提交

<view class='box'>
  <form bindsubmit='searchBox'>
      <input type='text' class='userBox' name='username'></input>
      <input type='text' class='pwdBox' name='pwd'></input>
      <button class='login' form-type='submit'>登录</button>
  </form>
  <text>输入的内容:{{username}}</text>
  <text>输入的内容2:{{pwd}}</text>
</view>
searchBox:function(e){
    const that = this;
    let first,second;
    that.setData({
      username : e.detail.value.username,
      pwd: e.detail.value.pwd
    })
  }

//这个函数一定要写在标签上才能用e.detail.value获取到

input 选择日期

wxml:微信日期选择器(input)
<picker mode="date" value='{{date}}' start="2019-08-08" end="" bindchange='bindDateChange'>
  <view class='lianxi'>
     <input type='date' disabled='true' name="addtime" value='{{date}}' placeholder='请选择日期'></input>
  </view>
</picker>

wxss:
.lianxi{
  background: #fff;
  margin: 0 20rpx;
  padding: 20rpx;
  display: flex;
}
.lianxi input{
   color: #999999;
  font-size: 26rpx;
}

wx.js:
//选择日期
  bindDateChange(e){
    this.setData({
      date:e.detail.value
    })
  },

 

php技术微信