首頁 > web前端 > js教程 > HTML頁面登入時的JS驗證方法_javascript技巧

HTML頁面登入時的JS驗證方法_javascript技巧

WBOY
發布: 2016-05-16 16:46:26
原創
1548 人瀏覽過

發展一個已註冊的HTML頁面, 用於蒐集使用者的註冊資訊。包括: 姓名(不能為空), 年齡(必須超過17歲), 體重(30-150kg), 班級(下拉列表),登陸密碼(至少8位長)、確認密碼(和登錄密碼一致),Email(不能為空) , 電話,QQ, 個人履歷等資訊。 並針對這些表的元素來建立對應的驗證,如果偵測到錯誤, 在輸入框後面用紅色的字顯示錯誤。要用到前面幾節學習過的單行文字輸入框text、下拉列錶框select、密碼輸入框password、多行文字輸入框textarea。這是一個較實用的用戶註冊表單.。

register.html:

複製程式碼 程式碼如下:













實驗2






















































Name*:
Age:
weight:
Class:
Password*:
Confirm Password*:
Email*:
TEL:
QQ:
Personal Information:


check.css:
複製代碼代碼如下:


代碼如下:


🎜>顏色:#C00;
字型粗細:粗體;
}
load.js: 複製程式碼

程式碼如下:


函數檢查(str)
{
var x = document.getElementById(str);
var y = document .getElementById(str "Check");
//alert("檢查!");
if(str=="name")
{
if(x.value=="" )
y.hidden = false;
否則
y.hidden = true;
}
else if(str=="age")
{
if(isNaN (x.value) || x.value y.hidden = false;
否則
y.hidden = true;
}
else if(str=="weight ")
{
x = x.value;
if(isNaN(x) || x 150)
y.hidden = false;
否則
y.hidden = true;
}
else if(str=="密碼")
{
x = x.value.length;
if(x {
y.hidden = false;
//alert("檢查!");
}
else
y.hidden = true;
}
else if (str=="cpassword")
{
var z = document.getElementById("password").value;
x = x.value;
if(x != z)
x = x.value;
if(x != z)
y.hidden = false;
否則
y.hidden = true;
}
else if(str=="email")
{
x = x.value. indexOf("@")
if(x == -1)
y.隱藏=假;
否則
y.hidden = true;
}
回傳y.hidden ;
}

function validate()
{
var arr=["姓名", "年齡", "體重", "密碼", "cpassword", "電子郵件" ];
var i = 0;
提交確定= true;
while(i {
if(!check(arr[i]))
{
alert(arr[i] " 錯誤! ");
提交OK = false;
休息;
}
我;
}
if(提交OK)
{
alert("提交成功! ");
回傳真;
}
else
{
alert("提交失敗");
回傳錯誤;
}
}
function load_greeting() { //alert("訪問n"); }
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板