基于jquery實(shí)現(xiàn)即時(shí)檢查格式是否正確的表單_

1、基于jquery實(shí)現(xiàn)即時(shí)檢查格式是否正確的表單_ 這篇文章主要為大家具體介紹了基于jquery實(shí)現(xiàn)即時(shí)檢查格式是否正確的表單具體代碼，感愛(ài)好的小伙伴們可以參考一下 現(xiàn)在許多網(wǎng)站的注冊(cè)模塊都可以實(shí)現(xiàn)即時(shí)檢查格式是否正確，這樣極大的增加了用戶體驗(yàn)，對(duì)開(kāi)發(fā)特別有利。 下面的代碼是利用jquery實(shí)現(xiàn)了對(duì)一個(gè)表單字段格式的即時(shí)檢查（包括字段長(zhǎng)度、郵箱格式），同時(shí)在提交時(shí)，再次動(dòng)身檢查大事。 留意這個(gè)檢查是keyup和focus上為主，利用這兩個(gè)大事來(lái)觸發(fā)blur（失去焦點(diǎn)）大事。 html head meta charset=utf-8 / title/title link href=css/styl

2、e.css rel=stylesheet type=text/css / script src=jquery-1.3.2.min.js/script script $(function () /為每個(gè)必填字段后面加上* $(form :input.required).each(function () var $required = $(strong class=high*/strong); $(this).parent().append($required); ); /textbox失去焦點(diǎn)大事 $(form :input).blur(function () var $parent = $(t

3、his).parent(); $parent.find(.formtips).remove(); if ($(this).is(#username) if (this.value = | this.value.length 6) var errorMsg = 請(qǐng)輸入至少6位的用戶名; $parent.append(span class=formtips onError + errorMsg + /span); else var okMsg = 輸入正確 $parent.append(span class=formtips onSuccess + okMsg + /span); if ($(th

4、is).is(#email) if (this.value = | (this.value != !/.+.+.a-zA-Z2,4$/.test(this.value) var errorMsg = 請(qǐng)輸入正確的E-Mail地址; $parent.append(span class=formtips onError + errorMsg + /span); else var okMsg = 輸入正確 $parent.append(span class=formtips onSuccess + okMsg + /span); ).keyup(function () $(this).trigger

5、Handler(blur);/keyup和focus利用triggerHandler來(lái)觸發(fā)blur大事 ).focus(function () $(this).triggerHandler(blur); ); $(#send).click(function () /提交按鈕大事 $(form .required:input).trigger(blur); var numError = $(form .onError).length; if(numError) return false; alert(注冊(cè)勝利，密碼已發(fā)到你的郵箱，請(qǐng)查收); ); ); /script /head body fo

6、rm method=post action= div class=int label for=username用戶名/label input type=text id=username class=required / /div div class=int label for=email郵箱/label input type=text id=email class=required / /div div class=int label for=personinfo個(gè)人資料/label input type=text id=personinfo / /div div class=sub input type=submit value=提交 i