js 表單驗證方式

// 在GBK編碼裡，除了ASCII字元，其它都占兩個字元寬

function get_bytes_length(str) {

return str.replace(/[^\x00-\xff]/g, "xx").length;

}

//去除所有空格

function trim(obj) {

var not_valid = /\s/;

while (not_valid.test(obj)) {

obj = obj.replace(not_valid, "");

return obj;

//隻能輸入數字、字母、下劃線

function nlu(obj) {

var valid = /^\w*$/;

return (valid.test(obj));

//普通驗證(obj:要驗證的輸入框的id;maxsize:可輸入最大字元長度;isNull:是否為必填項)

function check_obj1(obj, maxsize, isNull) {

//擷取輸入框值

var v = document.getElementById(obj).value;

//是必填項

if (isNull) {

if (v == "") {

document.getElementById("vd_" + obj).innerText = "不能空!";

return false;

//超過指定長度

if (get_bytes_length(trim(v)) > maxsize) {

document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165" + (maxsize / 2) +"\u4f4d\u4ee5\u5185\u7684\u4e2d\u6587\u6216" + maxsize + "\u4f4d\u4ee5\u5185\u82f1\u6587\u5b57\u7b26!";

if(isNull){

document.getElementById("vd_" + obj).innerText = "*";

return true;

}else{

document.getElementById("vd_" + obj).innerHTML = "<font color='green'>\u8f93\u5165\u6b63\u786e!</font>";

//驗證數字(obj:要驗證的輸入框的id;maxsize:可輸入最大字元長度;isNull:是否為必填項;isNumber:是否隻能輸入數字)

function check_obj2(obj, maxsize, isNull, isNumber) {

document.getElementById("vd_" + obj).innerText = "\u6700\u591a\u8f93\u5165" + maxsize + "\u4e2a\u6570\u5b57!";

//隻能是數字

if (isNumber) {

if (isNaN(v)) {

document.getElementById("vd_" + obj).innerText = "\u53ea\u80fd\u8f93\u5165\u6570\u5b57!";

//驗證數字、字母、下劃線(obj:要驗證的輸入框的id;maxsize:可輸入最大字元長度;isNull:是否為必填項;isNLU:是否為數字、字母、下劃線)

function check_obj3(obj, maxsize, isNull, isNLU) {

document.getElementById("vd_" + obj).innerText = "\u4e0d\u80fd\u4e3a\u7a7a!";

//隻能是數字、字母、下劃線

if (isNLU) {

if (!nlu(v)) {

document.getElementById("vd_" + obj).innerText ="\u53ea\u80fd\u8f93\u5165\u6570\u5b57\u3001\u5b57\u6bcd\u3001\u4e0b\u5212\u7ebf!";

//電話驗證(obj:要驗證的輸入框的id;maxsize:可輸入最大字元長度;isNull:是否為必填項)

function check_obj4(obj, maxsize, isNull) {

var reg=/(^[0-9]{3,4}\-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/;

if(!reg.test(v)){

document.getElementById("vd_" + obj).innerText = "格式錯誤!";

//驗證小數點(obj:要驗證的輸入框的id;maxsize:可輸入最大字元長度;isNull:是否為必填項;floatsize:小數點後長度;)

function check_obj5(obj, maxsize,isNull,floatsize) {

var counts=0;//是否有小數點

var j,c;

for(j=0;j<v.length;j++){

c=v.charAt(j)

if(( c >= '0' && c <= '9')||( c == ".")){

if(c=='.'){

counts++;

   document.getElementById("vd_" + obj).innerText = "隻能輸入數字和小數點!";

   return false;

if(counts>=1){//存在小數點

if(counts==1){//隻有一個小數點時

if(isNaN(v.substring(0,(maxsize-floatsize)))){

document.getElementById("vd_" + obj).innerText = "小數點前面隻能為數字!";

}else if(v.substring(0,v.indexOf('.')).length>(maxsize-floatsize)){

   document.getElementById("vd_" + obj).innerText = "小數點前面隻能為"+(maxsize-floatsize)+"位數字!";

}else if(v.substring(v.indexOf('.')+1).length>floatsize){

document.getElementById("vd_" + obj).innerText = "小數點後面隻能為"+floatsize+"位數字!";

}else if(v.length>(maxsize+1)){

document.getElementById("vd_" + obj).innerText = "長度超過範圍!";

if(isNull){//必填項顯示星号

}else{//否則顯示輸入正确

}else{//存在多個小數點時

document.getElementById("vd_" + obj).innerText = "小數點多了!";

}else{//不存在小數點

if(v.length>(maxsize-floatsize)){

document.getElementById("vd_" + obj).innerText = "小數點前面隻能為" + (maxsize-floatsize) + "位數字!";

//密碼驗證

function obj1_equals_obj2(obj1,obj2){

var v1 = document.getElementById(obj1).value;

var v2 = document.getElementById(obj2).value;

if(v1!=v2){

document.getElementById("vd_" + obj2).innerText = "兩次密碼不一緻!";

 return false;

document.getElementById("vd_" + obj2).innerText = "*";

用法舉例：

//客戶名稱

$("#customerId").keyup(function validate_customerId(){

  return check_obj1("customerId",6,true);

});

//本次合計應付款額

$("#mustpay").keyup(function validate_mustpay(){

   return check_obj5("mustpay",16,true,2);

////////////////////////////////批量驗證//////////////////////////////////

$(function validate_detail(){

var false_count=0;//記錄不合法資料數量

//委托單号

$("input[title='委托單号']").each(function(i){

$("#deliverscatbill"+(i+1)).keyup(function validate_capPlancontactH(){

return check_obj1("deliverscatbill"+(i+1),20,true);

if(!validate_capPlancontactH()){

false_count=false_count+1;

//車号

$("input[title='車号']").each(function(i){

$("#vehicleId"+(i+1)).keyup(function validate_vehicleId(){

return check_obj1("vehicleId"+(i+1),10,true);

if(!validate_vehicleId()){

//應付運費

$("input[name='cdItem.mustpay']").each(function(i){

$("#mustpay"+(i+1)).keyup(function validate_mustpay(){

return check_obj5("mustpay"+(i+1),16,true,2);

if(!validate_mustpay()){

if(false_count>0){//隻要存在不合法資料就傳回假，否則傳回真