wxml
-
<form bindsubmit=‘formSubmit’>
-
<view class=‘all’>
-
<text>手机号：
</text>
-
<input name=“phone” placeholder=‘请输入手机号’ type=‘number’ style=‘color:#333’ placeholder-style=“color:#666” maxlength=“11” bindinput=‘blurPhone’>
</input>
-
</view>
-
<button formType=“submit”>保存
</button>
-
</form>
wxss
-
.all {
-
border-top:
1rpx solid
#efefef;
-
border-bottom:
1rpx solid
#efefef;
-
height:
98rpx;
-
font-size:
28rpx;
-
display: flex;
-
align-items: center;
-
}
-
-
button {
-
width:
480rpx;
-
height:
80rpx;
-
background-color:
#7ecffd;
-
font-size:
30rpx;
-
color:
#fff;
-
border-radius:
8px;
-
margin:
50rpx auto;
-
}
js
-
Page({
-
-
/**
-
* 页面的初始数据
-
*/
-
data: {
-
ajxtrue:
false,
-
},
-
// 手机号验证
-
blurPhone:
function(e) {
-
var phone = e.detail.value;
-
let that =
this
-
if (!(
/^1[34578]\d{9}$/.test(phone))) {
-
-
this.setData({
-
ajxtrue:
false
-
})
-
if (phone.length >=
11) {
-
wx.showToast({
-
title:
'手机号有误',
-
icon:
'success',
-
duration:
2000
-
})
-
}
-
}
else {
-
this.setData({
-
ajxtrue:
true
-
})
-
console.log(
'验证成功', that.data.ajxtrue)
-
}
-
},
-
// 表单提交
-
formSubmit(e) {
-
let that =
this
-
let val = e.detail.value
-
let ajxtrue =
this.data.ajxtrue
-
if (ajxtrue ==
true) {
-
//表单提交进行
-
}
else {
-
wx.showToast({
-
title:
'手机号有误',
-
icon:
'success',
-
duration:
2000
-
})
-
}
-
},
-
/**
-
* 生命周期函数--监听页面加载
-
*/
-
onLoad:
function(options) {
-
-
},
-
-
/**
-
* 生命周期函数--监听页面初次渲染完成
-
*/
-
onReady:
function() {
-
-
},
-
-
/**
-
* 生命周期函数--监听页面显示
-
*/
-
onShow:
function() {
-
-
},
-
-
/**
-
* 生命周期函数--监听页面隐藏
-
*/
-
onHide:
function() {
-
-
},
-
-
/**
-
* 生命周期函数--监听页面卸载
-
*/
-
onUnload:
function() {
-
-
},
-
-
/**
-
* 页面相关事件处理函数--监听用户下拉动作
-
*/
-
onPullDownRefresh:
function() {
-
-
},
-
-
/**
-
* 页面上拉触底事件的处理函数
-
*/
-
onReachBottom:
function() {
-
-
},
-
-
/**
-
* 用户点击右上角分享
-
*/
-
onShareAppMessage:
function() {
-
-
}
-
})
</div>
扫一扫
3432
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
