点击按钮获取输入的手号码,判断输入的手机号格式是否正确
或者是否有输入号码
1.效果截图
不输入号码:
点击提交按钮后的效果
输入错误格式号码
点击提交按钮后的效果
2.代码实现
(1)wxml
<view class="box2">
<view class="box2_left">手机号</view>
<input type="text" class="box2_right" placeholder="请填写收货人的手机号" bindblur="change_tel" > </input>
</view>
<button bindtap="tap">确定</button>
(2)wxss
.box2{
width: 680rpx;
min-height: 90rpx;
display: flex;
flex-direction: row;
align-items: center;
border-bottom: solid 2rpx #D7D7D7;
}
.box2_left{
width: 180rpx;
font-size: 15px;
color: #000000;
}
.box2_right{
width: 406rpx;
min-height: 90rpx;
display: flex;
align-items: center;
font-size: 14px;
}
(3)js
data: {
//号码
tel:'',
}
/**
* 手机号
*/
change_tel:function(e){
var that = this;
this.setData({
tel: e.detail.value
})
},
/**
* 点击按钮
*/
tap:function(){
var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;
if (tel.length == 0){
wx.showToast({
title: '请输入手机号!',
icon: 'none',
duration: 5500
})
} else if (tel.length != 11||!myreg.test(tel)){
wx.showToast({
title: '请输入正确的手机号',
icon: 'none',
duration: 5500
})
}
}