js帶提示登錄表單驗證代碼下載,含驗證碼的登錄界面js

本文目錄一覽：

• 1、js驗證表單
• 2、js註冊表單驗證代碼
• 3、JS表單驗證代碼
• 4、求javascript表單驗證大全

js驗證表單

avaScript 表單驗證

JavaScript 可用來在數據被送往伺服器前對 HTML 表單中的這些輸入數據進行驗證。

被 JavaScript 驗證的這些典型的表單數據有：

用戶是否已填寫表單中的必填項目？

用戶輸入的郵件地址是否合法？

用戶是否已輸入合法的日期？

用戶是否在數據域 (numeric field) 中輸入了文本？

必填（或必選）項目

下面的函數用來檢查用戶是否已填寫表單中的必填（或必選）項目。假如必填或必選項為空，那麼警告框會彈出，並且函數的返回值為 false，否則函數的返回值則為 true（意味著數據沒有問題）：

function validate_required(field,alerttxt)

{

with (field)

{

if (value==null||value==””)

 {alert(alerttxt);return false}

else {return true}

}

}

下面是連同 HTML 表單的代碼：

html

head

script type=”text/javascript”function validate_required(field,alerttxt)

{

with (field)

 {

 if (value==null||value==””)

   {alert(alerttxt);return false}

 else {return true}

 }

}

function validate_form(thisform)

{

with (thisform)

 {

 if (validate_required(email,”Email must be filled out!”)==false)

   {email.focus();return false}

 }

}/script

/head

body

form action=”submitpage.htm” onsubmit=”return validate_form(this)” method=”post”

Email: input type=”text” name=”email” size=”30″

input type=”submit” value=”Submit”

/form

/body

/html

E-mail 驗證

下面的函數檢查輸入的數據是否符合電子郵件地址的基本語法。

意思就是說，輸入的數據必須包含 @ 符號和點號(.)。同時，@ 不可以是郵件地址的首字元，並且 @ 之後需有至少一個點號：

function validate_email(field,alerttxt)

{

with (field)

{

apos=value.indexOf(“@”)

dotpos=value.lastIndexOf(“.”)

if (apos1||dotpos-apos2)

 {alert(alerttxt);return false}

else {return true}

}

}

下面是連同 HTML 表單的完整代碼：

html

head

script type=”text/javascript”function validate_email(field,alerttxt)

{

with (field)

{

apos=value.indexOf(“@”)

dotpos=value.lastIndexOf(“.”)

if (apos1||dotpos-apos2)

 {alert(alerttxt);return false}

else {return true}

}

}

function validate_form(thisform)

{

with (thisform)

{

if (validate_email(email,”Not a valid e-mail address!”)==false)

 {email.focus();return false}

}

}/script

/head

body

form action=”submitpage.htm”onsubmit=”return validate_form(this);” method=”post”

Email: input type=”text” name=”email” size=”30″

input type=”submit” value=”Submit”

/form

/body

/html

js註冊表單驗證代碼

JS函數：

function check(){

    var username = document.getElementById(“username”).value;

    var pass1 = document.getElementById(“password”).value;

    var pass2 = document.getElementById(“confirm_password”).value;

    if (username == “”|| username == NULL || pass1 == “” || pass1 == NULL || pass2 == NULL || pass2 == “”) {

        alert(“用戶名或密碼不得為空！”);

        return false;

    }

}

表單提交的時候驗證：

input name=”reg” type=”submit”  value=”提交” onclick=”return check()”/

自己補全。

JS表單驗證代碼

我就簡單的寫個 希望可以幫助您

==================================

!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”

html xmlns=””

head

meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ /

title測試頁面/title

script type=”text/javascript”

function checkform(){

//驗證用戶名

if($(“username”).value == “”){

$(“n_msg”).innerHTML =”用戶名不可以為空”;

$(“username”).select();

$(“username”).focus();

return false;

}else{

if($(“username”).value.length 6){

$(“n_msg”).innerHTML = “用戶名必須大於6個字元”;

$(“username”).select();

$(“username”).focus();

return false;

}

}

//驗證密碼

if($(“password”).value == “”){

$(“p_msg”).innerHTML =”密碼不可以為空”;

$(“password”).select();

$(“password”).focus();

return false;

}else{

if($(“password”).value.length 10){

$(“p_msg”).innerHTML = “密碼必須大於10個字元”;

$(“password”).select();

$(“password”).focus();

return false;

}

}

//…..（下面的可以以此類推）

return true;

}

function $(id){

return document.getElementById(id);

}

/script

style type=”text/css”

body{ font:12px 宋體}

.c_red{ color:#f00}

/style

/head

body

table width=”500″ border=”0″ cellspacing=”0″ cellpadding=”0″

form method=”post” onsubmit=”return checkform()”

tr

td width=”89″用戶名/td

td width=”223″input name=”username” type=”text” id=”username” //td

td width=”188″ id=”n_msg” class=”c_red”/td

/tr

tr

td密碼/td

tdinput name=”password” type=”password” id=”password” //td

td id=”p_msg” class=”c_red”/td

/tr

tr

td colspan=”3″input name=”sub” type=”submit” id=”sub” value=”提交” //td

/tr

/form

/table

/body

/html

===========================

上面的為代碼部分 我已經調試沒問題 希望可以幫助您

祝早日解決~

求javascript表單驗證大全

JavaScript驗證表單大全

script

/*

用途：校驗ip地址的格式

輸入：strIP：ip地址

返回：如果通過驗證返回true,否則返回false；

*/

function isIP(strIP) {

if (isNull(strIP)) return false;

var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/g //匹配IP地址的正則表達式

if(re.test(strIP))

{

if( RegExp.$1 256 RegExp.$2256 RegExp.$3256 RegExp.$4256) return true;

}

return false;

}

/*

用途：檢查輸入字元串是否為空或者全部都是空格

輸入：str

返回：

如果全是空返回true,否則返回false

*/

function isNull( str ){

if ( str == “” ) return true;

var regu = “^[ ]+$”;

var re = new RegExp(regu);

return re.test(str);

}

/*

用途：檢查輸入對象的值是否符合整數格式

輸入：str 輸入的字元串

返回：如果通過驗證返回true,否則返回false

*/

function isInteger( str ){

var regu = /^[-]{0,1}[0-9]{1,}$/;

return regu.test(str);

}

/*

用途：檢查輸入手機號碼是否正確

輸入：

s：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function checkMobile( s ){

var regu =/^[1][3][0-9]{9}$/;

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/*

用途：檢查輸入字元串是否符合正整數格式

輸入：

s：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function isNumber( s ){

var regu = “^[0-9]+$”;

var re = new RegExp(regu);

if (s.search(re) != -1) {

return true;

} else {

return false;

}

}

/*

用途：檢查輸入字元串是否是帶小數的數字格式,可以是負數

輸入：

s：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function isDecimal( str ){

if(isInteger(str)) return true;

var re = /^[-]{0,1}(\d+)[\.]+(\d+)$/;

if (re.test(str)) {

if(RegExp.$1==0RegExp.$2==0) return false;

return true;

} else {

return false;

}

}

/*

用途：檢查輸入對象的值是否符合埠號格式

輸入：str 輸入的字元串

返回：如果通過驗證返回true,否則返回false

*/

function isPort( str ){

return (isNumber(str) str65536);

}

/*

用途：檢查輸入對象的值是否符合E-Mail格式

輸入：str 輸入的字元串

返回：如果通過驗證返回true,否則返回false

*/

function isEmail( str ){

var myReg = /^[-_A-Za-z0-9]+@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/;

if(myReg.test(str)) return true;

return false;

}

/*

用途：檢查輸入字元串是否符合金額格式

格式定義為帶小數的正數，小數點後最多三位

輸入：

s：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function isMoney( s ){

var regu = “^[0-9]+[\.][0-9]{0,3}$”;

var re = new RegExp(regu);

if (re.test(s)) {

return true;

} else {

return false;

}

}

/*

用途：檢查輸入字元串是否只由英文字母和數字和下劃線組成

輸入：

s：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function isNumberOr_Letter( s ){//判斷是否是數字或字母

var regu = “^[0-9a-zA-Z\_]+$”;

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/*

用途：檢查輸入字元串是否只由英文字母和數字組成

輸入：

s：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function isNumberOrLetter( s ){//判斷是否是數字或字母

var regu = “^[0-9a-zA-Z]+$”;

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/*

用途：檢查輸入字元串是否只由漢字、字母、數字組成

輸入：

value：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function isChinaOrNumbOrLett( s ){//判斷是否是漢字、字母、數字組成

var regu = “^[0-9a-zA-Z\u4e00-\u9fa5]+$”;

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/*

用途：判斷是否是日期

輸入：date：日期；fmt：日期格式

返回：如果通過驗證返回true,否則返回false

*/

function isDate( date, fmt ) {

if (fmt==null) fmt=”yyyyMMdd”;

var yIndex = fmt.indexOf(“yyyy”);

if(yIndex==-1) return false;

var year = date.substring(yIndex,yIndex+4);

var mIndex = fmt.indexOf(“MM”);

if(mIndex==-1) return false;

var month = date.substring(mIndex,mIndex+2);

var dIndex = fmt.indexOf(“dd”);

if(dIndex==-1) return false;

var day = date.substring(dIndex,dIndex+2);

if(!isNumber(year)||year”2100″ || year “1900”) return false;

if(!isNumber(month)||month”12″ || month “01”) return false;

if(daygetMaxDay(year,month) || day “01”) return false;

return true;

}

function getMaxDay(year,month) {

if(month==4||month==6||month==9||month==11)

return “30”;

if(month==2)

if(year%4==0year%100!=0 || year%400==0)

return “29”;

else

return “28”;

return “31”;

}

/*

用途：字元1是否以字元串2結束

輸入：str1：字元串；str2：被包含的字元串

返回：如果通過驗證返回true,否則返回false

*/

function isLastMatch(str1,str2)

{

var index = str1.lastIndexOf(str2);

if(str1.length==index+str2.length) return true;

return false;

}

/*

用途：字元1是否以字元串2開始

輸入：str1：字元串；str2：被包含的字元串

返回：如果通過驗證返回true,否則返回false

*/

function isFirstMatch(str1,str2)

{

var index = str1.indexOf(str2);

if(index==0) return true;

return false;

}

/*

用途：字元1是包含字元串2

輸入：str1：字元串；str2：被包含的字元串

返回：如果通過驗證返回true,否則返回false

*/

function isMatch(str1,str2)

{

var index = str1.indexOf(str2);

if(index==-1) return false;

return true;

}

/*

用途：檢查輸入的起止日期是否正確，規則為兩個日期的格式正確，

且結束如期=起始日期

輸入：

startDate：起始日期，字元串

endDate：結束如期，字元串

返回：

如果通過驗證返回true,否則返回false

*/

function checkTwoDate( startDate,endDate ) {

if( !isDate(startDate) ) {

alert(“起始日期不正確!”);

return false;

} else if( !isDate(endDate) ) {

alert(“終止日期不正確!”);

return false;

} else if( startDate endDate ) {

alert(“起始日期不能大於終止日期!”);

return false;

}

return true;

}

/*

用途：檢查輸入的Email信箱格式是否正確

輸入：

strEmail：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function checkEmail(strEmail) {

//var emailReg = /^[_a-z0-9]+@([_a-z0-9]+\.)+[a-z0-9]{2,3}$/;

var emailReg = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;

if( emailReg.test(strEmail) ){

return true;

}else{

alert(“您輸入的Email地址格式不正確！”);

return false;

}

}

/*

用途：檢查輸入的電話號碼格式是否正確

輸入：

strPhone：字元串

返回：

如果通過驗證返回true,否則返回false

*/

function checkPhone( strPhone ) {

var phoneRegWithArea = /^[0][1-9]{2,3}-[0-9]{5,10}$/;

var phoneRegNoArea = /^[1-9]{1}[0-9]{5,8}$/;

var prompt = “您輸入的電話號碼不正確!”

if( strPhone.length 9 ) {

if( phoneRegWithArea.test(strPhone) ){

return true;

}else{

alert( prompt );

return false;

}

}else{

if( phoneRegNoArea.test( strPhone ) ){

return true;

}else{

alert( prompt );

return false;

}

}

}

/script

form name=a onsubmit=”return checkPhone(document.a.b.value);”

INPUT TYPE=”text” NAME=”b”

input type=”submit” name=”Submit” value=”check”

/form