您好,登錄后才能下訂單哦!
本文實例講述了微信小程序實現提交input信息到后臺的方法。分享給大家供大家參考,具體如下:
wxml文件:
<!-- 用戶名事件綁定 --> <view class="fl_form"> <text>您的姓名</text> <input type="text" placeholder='請輸入您的姓名' value="{{userName}}" bindblur='userNameInput'></input> </view> <!-- 所屬部門事件綁定 --> <view class="fl_form"> <text>所屬部門</text> <input type="text" placeholder='請輸入所屬部門' value="{{userBranch}}" bindblur='userBranchInput'></input> </view> <!-- 聯系電話事件綁定 --> <view class="fl_form"> <text>聯系電話</text> <input type="text" placeholder='請輸入聯系電話' value="{{userTell}}" bindblur='userTellInput'></input> </view> <!-- 日期選擇器 mode="date" --> <view class="fl_form"> <picker mode="date" value="{{date}}" start="{{date}}" end="2020-01-01" bindchange="bindDateChange"> <view class="picker"> <text>選擇日期</text> <text class="chosedate">{{date}}</text> </view> </picker> </view> <!-- 時間選擇器 mode="time" --> <view class="fl_form newtime"> <picker mode="time" value="{{startime}}" start="09:00" end="21:00" bindchange="starttime"> <view class="picker"> <text>開始時間</text> <text class="chosedate">{{starttime}}</text> </view> </picker> <picker mode="time" value="{{endtime}}" start="09:00" end="21:00" bindchange="endtime"> <view class="picker end"> <text>結束時間</text> <text class="chosedate">{{endtime}}</text> </view> </picker> </view> <!-- 提交按鈕 --> <button class="formbtn" bindtap='orderMeeting'>提交</button>
js代碼:
var util = require('../../utils/util.js') //引入微信自帶的日期格式化 const app = getApp() Page({ data: { date:util.formatDate(new Date), //格式化日期 starttime: '9:00', //開始時間 endtime: '21:00', //結束時間 userName: '', userBranch: '', userTell: '' }, bindDateChange: function (e) { this.setData({ date: e.detail.value }) }, starttime: function (e) { this.setData({ starttime: e.detail.value }) }, endtime: function (e) { this.setData({ endtime: e.detail.value }) }, userNameInput: function (e) { // console.log(e.detail.value)設置用戶名 this.setData({ userName: e.detail.value }) }, userBranchInput: function (e) { //設置部門 this.setData({ userBranch: e.detail.value }) }, userTellInput: function (e) { //設置電話 this.setData({ userTell: e.detail.value }) }, orderMeeting: function () { //提交input信息到后臺 var userName = this.data.userName; console.log(userName) var userBranch = this.data.userBranch; console.log(userBranch) var userTell = this.data.userTell; console.log(userTell) var date = this.data.date; console.log(userTell) } })
希望本文所述對大家微信小程序開發(fā)有所幫助。
免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。