js簡單註冊頁面代碼驗證(javascript驗證註冊頁面代碼)

本文目錄一覽:

用html做的一個form+table註冊頁面里有一個驗證碼,要怎麼寫這個js代碼??

可以用JS做個簡單的驗證碼 script language=”javascript”var code; //在全局 定義驗證碼

function createCode()

{ //創建驗證碼函數

code = “”;

var codeLength =5;//驗證碼的長度

var selectChar = new Array(0,1,2,3,4,5,6,7,8,9,’A’,’B’,’C’,’D’,’E’,’F’,’G’,’H’,’I’,’J’,’K’,’L’,’M’,’N’,’O’,’P’,’Q’,’R’,’S’,’T’,’U’,’V’,’W’,’X’,’Y’,’Z’);//所有候選組成驗證碼的字元,當然也可以用中文的

for(var i=0;icodeLength;i++)

{

var charIndex =Math.floor(Math.random()*36);

code +=selectChar[charIndex];

}// 設置驗證碼的顯示樣式,並顯示

document.getElementById(“discode”).style.fontFamily=”Fixedsys”; //設置字體

document.getElementById(“discode”).style.letterSpacing=”3px”; //字體間距

document.getElementById(“discode”).style.color=”#ff0000″; //字體顏色

document.getElementById(“discode”).innerHTML=code; // 顯示

}/script 把上面一段JS代碼放到head/head標籤中在頁面裝載的時候,調用驗證碼創建函數 body onload=”createCode()

“在驗證碼輸入框的後面放一個標籤 span id=”discode”/span

js格式QQ註冊頁面,用正則表達式驗證各個文本框,輸入錯誤提示錯誤,全部輸入正確則輸出註冊成功的完整代碼

這個用插件來驗證的比較快。插件名稱:formvalidator.js ,網上下載個,使用方法:$(“#new_password”).formValidator({empty:true,onshow:”不修改密碼請留空。”,onfocus:”密碼應該為6-20位之間”}).inputValidator({min:5,max:20,onerror:”密碼應該為6-20位之間”});

$(“#new_pwdconfirm”).formValidator({empty:true,onshow:”不修改密碼請留空。”,onfocus:”請輸入兩次密碼不同。”,oncorrect:”密碼輸入一致”}).compareValidator({desid:”new_password”,operateor:”=”,onerror:”請輸入兩次密碼不同。”});

我想做一個用戶註冊的網頁界面,用javascript對輸入的數據進行驗證。

在源文件中調用這一段就可以了

// JavaScript Document

function $ (ElementID) {

return document.getElementById(ElementID);

}

function checkEmail(){

var mail=$(“email”);

var divID=$(“DivEmail”);

divID.innerHTML=””;

if(mail.value==””){

divID.innerHTML=”Email不能為空”;

//mail.focus();

return false;

}

if(mail.value.indexOf(“@”)==-1){

divID.innerHTML=”Email格式不正確,必須包含@”;

//mail.focus();

return false;

}

if(mail.value.indexOf(“.”)==-1){

divID.innerHTML=”Email格式不正確,必須包含.”;

//mail.focus();

return false;

}

//return true;

}

function checkPass(){

var pwd=$(“pwd”);

var divID=$(“DivPwd”);

divID.innerHTML=””;

if(pwd.value==””){

divID.innerHTML=”密碼不能為空”;

//pwd.focus();

return false;

}

if(pwd.value.length6){

divID.innerHTML=”密碼必須等於或大於6個字元”;

//pwd.focus();

return false;

}

//return true;

}

function checkRePass(){

var pwd=$(“pwd”); //輸入密碼

var repwd=$(“repwd”); //再次輸入密碼

var divID=$(“DivRepwd”);

divID.innerHTML=””;

if(pwd.value!=repwd.value){

divID.innerHTML=”兩次輸入的密碼不一致”;

return false;

}

//return true;

}

function checkUser(){

var user=$(“user”);

var divId=$(“DivUser”);

divId.innerHTML=””;

if(user.value==””){

divId.innerHTML=”姓名不能為空”;

//user.focus();

return false;

}

for(var i=0;iuser.value.length;i++){

var j=user.value.substring(i,i+1)

if(j=0){

divId.innerHTML=”姓名中不能包含數字”;

//user.focus();

return false;

}

}

//return true;

}

jsp關於js註冊表單驗證問題:事件為submit按鈕提交驗證的onClick事件,先看一下部分主要代碼:

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

html xmlns=””

head

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

title無標題文檔/title

script type=”text/javascript”

function check(obj){

var name=obj.value;

if(name==”)

{

alert(“no null!”);

return false;

}

}

/script

/head

body

form action=”test2.jsp” method=”post”

輸入用戶名:input name=”username” type=”text” onblur=”check(this)”/

用戶姓名:input name=”name” type=”text” onblur=”check(this)”/

input type=”submit” name=”Submit” value=”登錄”/

/form

/body

/html

一般驗證成功了 不用alert了

javascript寫的註冊頁面代碼

只是寫了 昵稱 密碼 確認密碼 電子郵件地址

其餘的自己寫一下吧

就是這個格式

自己完成吧!

html

head

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

titleUntitled Document/title

script language=”javascript”

function checkname(){

var div = document.getElementById(“div1”);

div.innerHTML = “”;

var name1 = document.form1.text1.value;

if (name1 == “”) {

div.innerHTML = “姓名不能為空!”;

document.form1.text1.focus();

return false;

}

if (name1.length 4 || name1.length 16) {

div.innerHTML = “姓名輸入的長度4-16個字元!”;

document.form1.text1.select();

return false;

}

var charname1 = name1.toLowerCase();

for (var i = 0; i name1.length; i++) {

var charname = charname1.charAt(i);

if (!(charname = 0 charname = 9) (!(charname = ‘a’ charname = ‘z’)) (charname != ‘_’)) {

div.innerHTML = “姓名包含非法字母,只能包含字母,數字,和下劃線”;

document.form1.text1.select();

return false;

}

}

return true;

}

function checkpassword(){

var div = document.getElementById(“div2”);

div.innerHTML = “”;

var password = document.form1.text2.value;

if (password == “”) {

div.innerHTML = “密碼不位空!”;

document.form1.text2.focus();

return false;

}

if (password.length 4 || password.length 12) {

div.innerHTML = “密碼長度4-12位”;

document.form1.text2.select();

return false;

}

return true;

}

function checkrepassword(){

var div = document.getElementById(“div3”);

div.innerHTML = “”;

var password = document.form1.text2.value;

var repass = document.form1.text3.value;

if (repass == “”) {

div.innerHTML = “密碼不位空!”;

document.form1.text3.focus();

return false;

}

if (password != repass) {

div.innerHTML = “輸入密碼和確認密碼長度不一致”;

document.form1.text3.select();

return false;

}

return true;

}

function checkEmail(){

var div = document.getElementById(“div4”);

div.innerHTML = “”;

var email = document.form1.text5.value;

var sw = email.indexOf(“@”, 0);

var sw1 = email.indexOf(“.”, 0);

var tt = sw1 – sw;

if (email.length == 0) {

div.innerHTML = “電子郵件不能位空”;

document.form1.text5.focus();

return false;

}

if (email.indexOf(“@”, 0) == -1) {

div.innerHTML = “電子郵件格式不正確,必須包含@符號!”;

document.form1.text5.select();

return false;

}

if (email.indexOf(“.”, 0) == -1) {

div.innerHTML = “電子郵件格式不正確,必須包含.符號!”;

document.form1.text5.select();

return false;

}

if (tt == 1) {

div.innerHTML = “郵件格式不對。@和.不可以挨著!”;

document.form1.text5.select();

return false;

}

if (sw sw1) {

div.innerHTML = “電子郵件格式不正確,@符號必須在.之前”;

document.form1.text5.select();

return false;

}

else {

return true;

}

return ture;

}

function check(){

if (checkname() checkpassword() checkrepassword() checkEmail()) {

return true;

}

else {

return false;

}

}

/script

/head

body

form name=”form1″ method=”post” action=”2.html” onsubmit=”return check()”

table

tr

td

用戶名:

/td

td

input id=”text1″ type=”text” name=”text1″ onblur=”check()”

div id=”div1″ style=”display:inline”

/div

/td

/tr

tr

td

密碼:

/td

td

input id=”text2″ type=”password” name=”text2″ onblur=”check()”

div id=”div2″ style=”display:inline”

/div

/td

/tr

tr

td

確認密碼:

/td

td

input id=”text3″ type=”password” name=”text3″ onblur=”check()”

div id=”div3″ style=”display:inline”

/div

/td

/tr

tr

td

電子郵件地址:

/td

td

input id=”text4″ type=”text” name=”text4″ onblur=”check()”

div id=”div4″ style=”display:inline”

/div

/td

/tr

tr align=”center”

td align=”center”

input type=”submit” value=”提交” name=”tect6″input type=”reset” value=”重置” name=”text7″

/td

/tr

/table

/form

/body

/html

JS註冊頁面代碼?

這不是源碼不源碼的事,這得看你用的是什麼技術,asp?php?JSP?能給你的只有Ajax的代碼,後台的得看你用的什麼技術。var xmlHttp;

try {

xmlHttp = new XMLHttpRequest();

} catch (trymicrosoft) {

try {

xmlHttp = new ActiveXObject(“Msxml2.XMLHTTP”);

} catch (othermicrosoft) {

try {

xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);

} catch (failed) {

xmlHttp = false;

}

}

}function getList(id) {

xmlHttp.open(‘POST’, ‘%=basePath%displayWorkCharacterTree.do?id=’+id,true);

xmlHttp.onreadystatechange = handleResponse;

xmlHttp.send(null);

}function handleResponse() { if(xmlHttp.readyState == 4){

if (xmlHttp.status == 200 || xmlHttp.status == 0){

alert(“已經註冊”); }

}

}

原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-tw/n/232407.html

(0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
小藍的頭像小藍
上一篇 2024-12-11 12:51
下一篇 2024-12-11 12:51

相關推薦

  • Python周杰倫代碼用法介紹

    本文將從多個方面對Python周杰倫代碼進行詳細的闡述。 一、代碼介紹 from urllib.request import urlopen from bs4 import Bea…

    編程 2025-04-29
  • JS Proxy(array)用法介紹

    JS Proxy(array)可以說是ES6中非常重要的一個特性,它可以代理一個數組,監聽數據變化並進行攔截、處理。在實際開發中,使用Proxy(array)可以方便地實現數據的監…

    編程 2025-04-29
  • Python字元串寬度不限制怎麼打代碼

    本文將為大家詳細介紹Python字元串寬度不限制時如何打代碼的幾個方面。 一、保持代碼風格的統一 在Python字元串寬度不限制的情況下,我們可以寫出很長很長的一行代碼。但是,為了…

    編程 2025-04-29
  • Python基礎代碼用法介紹

    本文將從多個方面對Python基礎代碼進行解析和詳細闡述,力求讓讀者深刻理解Python基礎代碼。通過本文的學習,相信大家對Python的學習和應用會更加輕鬆和高效。 一、變數和數…

    編程 2025-04-29
  • Python簡單數學計算

    本文將從多個方面介紹Python的簡單數學計算,包括基礎運算符、函數、庫以及實際應用場景。 一、基礎運算符 Python提供了基礎的算術運算符,包括加(+)、減(-)、乘(*)、除…

    編程 2025-04-29
  • Python滿天星代碼:讓編程變得更加簡單

    本文將從多個方面詳細闡述Python滿天星代碼,為大家介紹它的優點以及如何在編程中使用。無論是剛剛接觸編程還是資深程序員,都能從中獲得一定的收穫。 一、簡介 Python滿天星代碼…

    編程 2025-04-29
  • 倉庫管理系統代碼設計Python

    這篇文章將詳細探討如何設計一個基於Python的倉庫管理系統。 一、基本需求 在著手設計之前,我們首先需要確定倉庫管理系統的基本需求。 我們可以將需求分為以下幾個方面: 1、庫存管…

    編程 2025-04-29
  • 寫代碼新手教程

    本文將從語言選擇、學習方法、編碼規範以及常見問題解答等多個方面,為編程新手提供實用、簡明的教程。 一、語言選擇 作為編程新手,選擇一門編程語言是很關鍵的一步。以下是幾個有代表性的編…

    編程 2025-04-29
  • Python實現簡易心形代碼

    在這個文章中,我們將會介紹如何用Python語言編寫一個非常簡單的代碼來生成一個心形圖案。我們將會從安裝Python開始介紹,逐步深入了解如何實現這一任務。 一、安裝Python …

    編程 2025-04-29
  • 怎麼寫不影響Python運行的長段代碼

    在Python編程的過程中,我們不可避免地需要編寫一些長段代碼,包括函數、類、複雜的控制語句等等。在編寫這些代碼時,我們需要考慮代碼可讀性、易用性以及對Python運行性能的影響。…

    編程 2025-04-29

發表回復

登錄後才能評論