Ajax注冊表單用戶名實(shí)時(shí)驗(yàn)證.

Ajax注冊表單用戶名實(shí)時(shí)驗(yàn)證

1.1.1 摘要

很多時(shí)候在網(wǎng)站上注冊時(shí)，我們會(huì)發(fā)現(xiàn)，注冊表單通常需要檢查用戶名和電子郵件地址的可用性；從而確保用戶之間不擁有相同的用戶名和電子郵件地址；一些網(wǎng)站喜歡在用戶提交填寫的用戶信息時(shí)，做信息可用性的檢查，而一些網(wǎng)站會(huì)做實(shí)時(shí)的用戶名和電子郵件地址可用性檢查，例如：“用戶名”文本框失去焦點(diǎn)時(shí)；就用戶體驗(yàn)來說，實(shí)時(shí)的用戶信息檢查用戶體驗(yàn)效果更好，而不是在表單提交后，告訴用戶信息不符合系統(tǒng)要求。

下面截圖是新浪微博的注冊界面，它采用的是實(shí)時(shí)的用戶信息檢查，如：手機(jī)號(hào)碼和用戶名等信息。

圖1新浪微博注冊表單

本文目錄

注冊表單設(shè)計(jì)

jQuery Validation插件

數(shù)據(jù)表設(shè)計(jì)

服務(wù)端設(shè)計(jì)

前端實(shí)現(xiàn)

1.1.2 正文

假設(shè)，現(xiàn)在要求我們實(shí)現(xiàn)一個(gè)注冊界面并且它采用實(shí)時(shí)方式檢查用戶信息是否符合系統(tǒng)的要求。

其中，注冊界面包含：用戶名，郵件地址，密碼和微博地址等信息；實(shí)時(shí)檢查：當(dāng)文本框失去焦點(diǎn)時(shí)對信息進(jìn)行實(shí)時(shí)檢查，例如：“用戶名”文本框失去焦點(diǎn)時(shí)，觸發(fā)頁面發(fā)送Ajax請求，到數(shù)據(jù)庫中用戶是否可用，接著把查詢結(jié)果返回到前端頁面中。

對于表單輸入檢查，我們將使用前一博文《自定義jQuery插件Step by Step》中，自定義表單信息檢查插件對輸入信息進(jìn)行檢查。

圖2注冊驗(yàn)證過程

注冊表單設(shè)計(jì)

現(xiàn)在，讓我們定義注冊表單，它包含：用戶名，郵件地址，密碼和微博地址等信息，由于時(shí)間的關(guān)系，我們已經(jīng)把注冊表單界面的定義好了，具體實(shí)現(xiàn)代碼如下：

Sign Up

Name

Email

Password

Weibo

總結(jié)

以上是生活随笔為你收集整理的ajax注册表单用户名实时验证,Ajax注册表单用户名实时验证..doc的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。