本文實(shí)例為大家分享了jQuery實(shí)現(xiàn)表單驗(yàn)證的具體代碼,供大家參考,具體內(nèi)容如下
成都創(chuàng)新互聯(lián)自成立以來,一直致力于為企業(yè)提供從網(wǎng)站策劃、網(wǎng)站設(shè)計、成都網(wǎng)站建設(shè)、成都做網(wǎng)站、電子商務(wù)、網(wǎng)站推廣、網(wǎng)站優(yōu)化到為企業(yè)提供個性化軟件開發(fā)等基于互聯(lián)網(wǎng)的全面整合營銷服務(wù)。公司擁有豐富的網(wǎng)站建設(shè)和互聯(lián)網(wǎng)應(yīng)用系統(tǒng)開發(fā)管理經(jīng)驗(yàn)、成熟的應(yīng)用系統(tǒng)解決方案、優(yōu)秀的網(wǎng)站開發(fā)工程師團(tuán)隊及專業(yè)的網(wǎng)站設(shè)計師團(tuán)隊。<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Reg</title> <style> .state1{ color:#aaa; } .state2{ color:#000; } .state3{ color:red; } .state4{ color:green; } </style> <script src="jquery.js"></script> <script> $(function(){ var ok1=false; var ok2=false; var ok3=false; var ok4=false; // 驗(yàn)證用戶名 $('input[name="username"]').focus(function(){ $(this).next().text('用戶名應(yīng)該為3-20位之間').removeClass('state1').addClass('state2'); }).blur(function(){ if($(this).val().length >= 3 && $(this).val().length <=12 && $(this).val()!=''){ $(this).next().text('輸入成功').removeClass('state1').addClass('state4'); ok1=true; }else{ $(this).next().text('用戶名應(yīng)該為3-20位之間').removeClass('state1').addClass('state3'); } }); //驗(yàn)證密碼 $('input[name="password"]').focus(function(){ $(this).next().text('密碼應(yīng)該為6-20位之間').removeClass('state1').addClass('state2'); }).blur(function(){ if($(this).val().length >= 6 && $(this).val().length <=20 && $(this).val()!=''){ $(this).next().text('輸入成功').removeClass('state1').addClass('state4'); ok2=true; }else{ $(this).next().text('密碼應(yīng)該為6-20位之間').removeClass('state1').addClass('state3'); } }); //驗(yàn)證確認(rèn)密碼 $('input[name="repass"]').focus(function(){ $(this).next().text('輸入的確認(rèn)密碼要和上面的密碼一致,規(guī)則也要相同').removeClass('state1').addClass('state2'); }).blur(function(){ if($(this).val().length >= 6 && $(this).val().length <=20 && $(this).val()!='' && $(this).val() == $('input[name="password"]').val()){ $(this).next().text('輸入成功').removeClass('state1').addClass('state4'); ok3=true; }else{ $(this).next().text('輸入的確認(rèn)密碼要和上面的密碼一致,規(guī)則也要相同').removeClass('state1').addClass('state3'); } }); //驗(yàn)證郵箱 $('input[name="email"]').focus(function(){ $(this).next().text('請輸入正確的EMAIL格式').removeClass('state1').addClass('state2'); }).blur(function(){ if($(this).val().search(/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/)==-1){ $(this).next().text('請輸入正確的EMAIL格式').removeClass('state1').addClass('state3'); }else{ $(this).next().text('輸入成功').removeClass('state1').addClass('state4'); ok4=true; } }); //提交按鈕,所有驗(yàn)證通過方可提交 $('.submit').click(function(){ if(ok1 && ok2 && ok3 && ok4){ $('form').submit(); }else{ return false; } }); }); </script> </head> <body> <form action='do.php' method='post' > 用 戶 名:<input type="text" name="username"> <span class='state1'>請輸入用戶名</span><br/><br/> 密 碼:<input type="password" name="password"> <span class='state1'>請輸入密碼</span><br/><br/> 確認(rèn)密碼:<input type="password" name="repass"> <span class='state1'>請輸入確認(rèn)密碼</span><br/><br/> 郵 箱:<input type="text" name="email"> <span class='state1'>請輸入郵箱</span><br/><br/> <a href="javascript:;" rel="external nofollow" ><img class='submit' type='image' src='./images/reg.gif' /></a> </form> </body> </html>
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點(diǎn)與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
當(dāng)前標(biāo)題:jQuery實(shí)現(xiàn)所有驗(yàn)證通過方可提交的表單驗(yàn)證-創(chuàng)新互聯(lián)
URL標(biāo)題:http://vcdvsql.cn/article18/iiddp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供電子商務(wù)、服務(wù)器托管、網(wǎng)站策劃、網(wǎng)頁設(shè)計公司、微信小程序、面包屑導(dǎo)航
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容