DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> js與jquery正則驗證電子郵箱、手機號、郵政編碼的方法
js與jquery正則驗證電子郵箱、手機號、郵政編碼的方法
編輯:關於JavaScript     

本文實例講述了js與jquery正則驗證電子郵箱、手機號、郵政編碼的方法。

jQuery代碼:

//驗證郵政編碼
 $("#postcode").blur(function(){
  //獲取郵政編碼
  var postcode=$("#postcode").val();
  if(is_postcode(postcode)){
   $("#postcode_info").html("");
  }else{
   $("#postcode_info").html("郵編格式不正確");
   return false;
  }
 });
 //驗證手機號碼
 $("#mobile").blur(function(){
  //獲取手機號,並去除左右兩邊空格
  var mobile=$.trim($("#mobile").val());
  if(is_mobile(mobile)){
   $("#mobile_info").html("");
  }else{
   $("#mobile_info").html("手機號格式不正確");
   return false;
  }
 });
 //驗證email
 $("#email").blur(function(){
  //獲取email
  var email=$("#email").val();
  if(is_email(email)){
   $("#email_info").html("");
  }else{
   $("#email_info").html("電子郵件格式不正確");
   return false;
  }
 });
});

js代碼:

//訂單提交頁-驗證郵政編碼
function is_postcode(postcode) {
 if ( postcode == "") {
  return false;
 } else {
  if (! /^[0-9][0-9]{5}$/.test(postcode)) {
   return false;
  }
 }
 return true;
}
//訂單提交頁-驗證手機號
function is_mobile(mobile) {
  if( mobile == "") {
  return false;
  } else {
  if( ! /^0{0,1}(13[0-9]|15[0-9]|18[0-9]|14[0-9])[0-9]{8}$/.test(mobile) ) {
  return false;
  }
  return true;
 }
}
//訂單提交頁-驗證email的合法性
function is_email(email) {
 if ( email == "") {
  return false;
 } else {
  if (! /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/.test(email)) {
   return false;
  }
 }
 return true;
}

PS:這裡再為大家提供2款非常方便的正則表達式工具供大家參考使用:

JavaScript正則表達式在線測試工具:
http://tools.jb51.net/regex/javascript

正則表達式在線生成工具:
http://tools.jb51.net/regex/create_reg

希望本文所述對大家javascript程序設計有所幫助。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved