Axure怎么實(shí)現(xiàn)電話號(hào)碼的驗(yàn)證的原型?

發(fā)布時(shí)間：2016-03-30 10:00:25 作者：佚名

Axure怎么實(shí)現(xiàn)電話號(hào)碼的驗(yàn)證的原型？很多網(wǎng)站都會(huì)用電話號(hào)碼來(lái)什么賬號(hào)，但是怎么才能判斷別人輸入的電話號(hào)碼正不正確呢？下面我們來(lái)看看Axure電話號(hào)碼的驗(yàn)證的教程，需要的朋友可以參考下

Axure制作原型的登陸驗(yàn)證時(shí)，不免要使用到手機(jī)、郵箱的驗(yàn)證，沒(méi)有正則表達(dá)式，我們來(lái)使用字符串的方式做簡(jiǎn)單的驗(yàn)證：

一、思路

1、驗(yàn)證長(zhǎng)度是否為11位

2、設(shè)置輸入長(zhǎng)度為11位

3、驗(yàn)證輸入的值是否為數(shù)字

3、截取字符串的前三位判斷是否是在已經(jīng)發(fā)布的號(hào)碼段且在前三位

二、Axure手機(jī)號(hào)碼驗(yàn)證

1、先做一個(gè)簡(jiǎn)易的布局，并對(duì)文件進(jìn)行命名

文本框：phonenum

消息提示：phonemess

2、選中phonenum,進(jìn)行屬性設(shè)置：

選擇類型為：phonenum（手機(jī)號(hào)）

提示信息為：請(qǐng)輸入手機(jī)號(hào)

最大長(zhǎng)度為：11

3、為文本框（phonenum）添加：文字改變時(shí) 交互用例：

4、點(diǎn)擊：添加條件，并選擇值選項(xiàng)，選擇值以后對(duì)輸入的文字進(jìn)行大小判斷：

5、插入一個(gè)變量，參考下圖，并按照第二張圖進(jìn)行設(shè)置，

6、然候進(jìn)行消息提示設(shè)置，設(shè)置文本為：大于100000000：參考下圖：

7、再次添加一個(gè)case，并設(shè)置文本為：輸入值有誤；

8、此時(shí)進(jìn)行一次預(yù)覽，來(lái)看效果：

輸入：1234567890提示輸入有誤

輸入：12345678901提示大于10000000000

結(jié)合我們對(duì)輸入框限制的輸入長(zhǎng)度，我們可以確認(rèn)當(dāng)前的輸入長(zhǎng)度為11個(gè)

9、下面需要進(jìn)行：數(shù)字和字符串的驗(yàn)證（雖然我們?cè)O(shè)置了類型為手機(jī)號(hào)，但用戶依然可以輸入字符串，且文本框接受輸入，所以我們必須進(jìn)行判斷）：

編輯：case1,新增條件：此處添加的變量，與第一次添加的變量含義一樣，均為phonenum的元件文字

10、以上我們確保了：用戶輸入的是數(shù)字，且長(zhǎng)度等于11，下面我們進(jìn)行字符串的截取判斷，判斷前三位是否是我們已知的號(hào)碼段就可以，來(lái)看設(shè)置：

在case1上繼續(xù)添加判斷，插入變量利用indexof來(lái)判斷：130 131等號(hào)段是否出現(xiàn)在前三位即可，函數(shù)：[[(LVAR1.indexOf('130')==0)||(LVAR1.indexOf('131')==0)]]，LVAR1的設(shè)置參考下圖，依然是phonenum的元件文字：

11、截止到此處，我們可以進(jìn)行再一次的預(yù)覽，來(lái)判斷我們輸入的號(hào)碼是否在130 131 號(hào)段內(nèi)：

12、根據(jù)第11步的預(yù)覽，完全正確，那么我們來(lái)繼續(xù)完善其他號(hào)段即可：

函數(shù)：

[[(LVAR1.indexOf('130')==0)||(LVAR1.indexOf('131')==0)||(LVAR1.indexOf('132')==0)||(LVAR1.indexOf('133')==0)||(LVAR1.indexOf('134')==0)||(LVAR1.indexOf('135')==0)||(LVAR1.indexOf('136')==0)||(LVAR1.indexOf('137')==0)||(LVAR1.indexOf('138')==0)||(LVAR1.indexOf('139')==0)||(LVAR1.indexOf('180')==0)||(LVAR1.indexOf('189')==0)||(LVAR1.indexOf('150')==0)||(LVAR1.indexOf('151')==0)||(LVAR1.indexOf('159')==0)||(LVAR1.indexOf('157')==0)||(LVAR1.indexOf('177')==0)]]

號(hào)段判斷的不是特別全，您可以自行添加其他號(hào)段。

另：將提示信息：大于10000000000，更改成：輸入正確

再次預(yù)覽進(jìn)行測(cè)試：