微信小程序?qū)崿F(xiàn)手機(jī)號(hào)碼驗(yàn)證
本文實(shí)例為大家分享了微信小程序?qū)崿F(xiàn)手機(jī)號(hào)碼驗(yàn)證的具體代碼,供大家參考,具體內(nèi)容如下
wxml
<form bindsubmit='formSubmit'> ? <view class='all'> ? ? <text>手機(jī)號(hào):</text> ? ? <input name="phone" placeholder='請(qǐng)輸入手機(jī)號(hào)' 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({
?
? /**
? ?* 頁(yè)面的初始數(shù)據(jù)
? ?*/
? data: {
? ? ajxtrue: false,
? },
? // 手機(jī)號(hào)驗(yàn)證
? 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: '手機(jī)號(hào)有誤',
? ? ? ? ? icon: 'success',
? ? ? ? ? duration: 2000
? ? ? ? })
? ? ? }
? ? } else {
? ? ? this.setData({
? ? ? ? ajxtrue: true
? ? ? })
? ? ? console.log('驗(yàn)證成功', that.data.ajxtrue)
? ? }
? },
? // 表單提交
? formSubmit(e) {
? ? let that = this
? ? let val = e.detail.value
? ? let ajxtrue = this.data.ajxtrue
? ? if (ajxtrue == true) {
? ? ? //表單提交進(jìn)行
? ? } else {
? ? ? wx.showToast({
? ? ? ? title: '手機(jī)號(hào)有誤',
? ? ? ? icon: 'success',
? ? ? ? duration: 2000
? ? ? })
? ? }
? },
? /**
? ?* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面加載
? ?*/
? onLoad: function(options) {
?
? },
?
? /**
? ?* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面初次渲染完成
? ?*/
? onReady: function() {
?
? },
?
? /**
? ?* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面顯示
? ?*/
? onShow: function() {
?
? },
?
? /**
? ?* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面隱藏
? ?*/
? onHide: function() {
?
? },
?
? /**
? ?* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面卸載
? ?*/
? onUnload: function() {
?
? },
?
? /**
? ?* 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽(tīng)用戶下拉動(dòng)作
? ?*/
? onPullDownRefresh: function() {
?
? },
?
? /**
? ?* 頁(yè)面上拉觸底事件的處理函數(shù)
? ?*/
? onReachBottom: function() {
?
? },
?
? /**
? ?* 用戶點(diǎn)擊右上角分享
? ?*/
? onShareAppMessage: function() {
?
? }
})以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- uniapp抖音小程序一鍵獲取用戶手機(jī)號(hào)的示例代碼
- UNIAPP實(shí)現(xiàn)微信小程序登錄授權(quán)和手機(jī)號(hào)授權(quán)功能(uniapp做微信小程序)
- 微信小程序獲取用戶手機(jī)號(hào)碼詳細(xì)教程(前端+后端)
- 微信小程序中獲取用戶手機(jī)號(hào)授權(quán)登錄詳細(xì)步驟
- uniapp微信小程序授權(quán)登錄并獲取手機(jī)號(hào)的方法
- uniapp+.net?core實(shí)現(xiàn)微信小程序獲取手機(jī)號(hào)功能
- PHP配合微信小程序?qū)崿F(xiàn)獲取手機(jī)號(hào)碼詳解
- 微信小程序登錄方法之授權(quán)登陸及獲取微信用戶手機(jī)號(hào)
- 微信小程序獲取用戶手機(jī)號(hào)碼的詳細(xì)步驟
- 抖音小程序一鍵獲取手機(jī)號(hào)的實(shí)現(xiàn)思路
相關(guān)文章
Javascript利用canvas繪制兩點(diǎn)間曲線和箭頭
這篇文章主要為大家詳細(xì)介紹了Javascript如何利用canvas實(shí)現(xiàn)在兩點(diǎn)間繪制曲線和矩形,并且在矩形中繪制文字,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-10-10
JavaScript表單驗(yàn)證實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了JavaScript表單驗(yàn)證的實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05
完美實(shí)現(xiàn)js拖拽效果 return false用法詳解
這篇文章主要為大家詳細(xì)介紹了完美實(shí)現(xiàn)js拖拽效果的代碼,一起學(xué)習(xí)return false的用法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07
JS幻燈片可循環(huán)播放可平滑旋轉(zhuǎn)帶滾動(dòng)導(dǎo)航(自寫(xiě))
本文為大家介紹下實(shí)現(xiàn)JS幻燈片可循環(huán)播放帶滾動(dòng)導(dǎo)航可平滑旋轉(zhuǎn)的全過(guò)程,效果還不錯(cuò),由需要的朋友可以參考下,希望對(duì)大家有所幫助2013-08-08
詳解javascript如何在跨域請(qǐng)求中攜帶cookie
本文主要介紹了詳解javascript如何在跨域請(qǐng)求中攜帶cookie,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-03-03
JavaScript字符串轉(zhuǎn)數(shù)字的5種方法及遇到的坑
JavaScript是一個(gè)神奇的語(yǔ)言,字符串轉(zhuǎn)數(shù)字有5種方法,各有各的坑法!接下來(lái)通過(guò)本文給大家介紹JavaScript字符串轉(zhuǎn)數(shù)字的5種方法及其陷阱,感興趣的朋友一起看看吧2018-07-07
微信小程序記錄用戶移動(dòng)軌跡的實(shí)戰(zhàn)記錄
最近遇到一個(gè)小程序的開(kāi)發(fā)需求,直接可以通過(guò)小程序就記錄運(yùn)動(dòng)軌跡,所以這篇文章主要給大家介紹了關(guān)于微信小程序記錄用戶移動(dòng)軌跡的相關(guān)資料,需要的朋友可以參考下2021-08-08

