页面:
<view class="page">
<text style="padding-left:102px;">更改个人信息</text>
<view style="margin:4px 18px;">
<view>
<text>姓名:</text>
<input type="text" value="{{name}}" class="xin" bindinput="inputName" placeholder="请输入要修改的姓名"></input>
</view>
<view>
<text>学号:</text>
<input type="number" value="{{number}}" class="xin" bindinput="inputNumber" placeholder="请输入要修改的学号"></input>
</view>
</view>
<button type="submit" bindtap="save" class="save" disabled='{{isDisabled}}'>保存</button>
</view>
js:
const app = getApp()
Page({
data: {
name: '',
number: '',
isDisabled: true //表示页面加载完成时disabled为禁用状态
},
onLoad: function(options) {
let number = options.number
let name = options.name
this.setData({
number,
name
})
},
save: function(e) {
let name = this.data.name;
let number=this.data.number
let token = wx.getStorageSync('token')
wx.request({
url: app.globalData.updatexuehao,
method: 'POST',
header: {
'content-type': 'application/x-www-form-urlencoded',
// 'cookie': token
},
data: {
token,name,number
},
success: res => {
if (res.data.error == true) {
wx.showToast({
title: res.data.message,
icon: 'none',
duration: 2000
})
} else {
wx.showToast({
title: res.data.message,
icon: 'success',
duration: 5000
})
wx.removeStorageSync('info')
wx.navigateBack({
complete: (res) => {}
})
}
}
})
},
inputName: function(e) {
var name = e.detail.value
this.setData({
name
})
console.log(name)
if (name !== '') {
this.setData({
isDisabled: false
})
} else {
this.setData({
isDisabled: true
})
}
},
inputNumber: function(e) {
var number = e.detail.value
this.setData({
number
})
// console.log()
if (number !== '') {
this.setData({
isDisabled: false
})
} else {
this.setData({
isDisabled: true
})
}
},
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
样式:
/* 设置不可用状态的背景色 */
button[disabled] {
background-color: #eaeaea !important;
color: #fff;
}
.save {
width: 17%;
padding: 5rpx;
margin: 0;
font-weight: none;
font-size: 40rpx;
color: #fff;
background-color: #298ef7;
}
.xin {
border: 1px solid #ccc;
margin: 3px 6px;
width: 93%;
padding: 4px;
}