*仿IT英才网 注册(限时提示)

news/2024/7/4 1:42:49 标签: search, input, class, function, div, javascript
class="baidu_pl"> <div id="article_content" class="article_content clearfix"> <div id="content_views" class="htmledit_views">

 效果见 http://www.cnithr.com/personal/register/user_register_login.php?reg_from=raffle20080615_69&tta=45&ttu=978167

注册登陆 像个组件一样
四种状态:
初始
foucus
lostfoucs 检测  right/wrong

 

login.jsp
<%@ page language="java" import="java.util.*" contentType="text/html; charset=GB2312"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<LINK href="img/base.css" type=text/css rel=stylesheet>
<LINK href="img/personal.css" type=text/css rel=stylesheet>
<SCRIPT language=javascript src="img/userreg.js"></SCRIPT>
</HEAD>
<BODY>
<DIV id=plocation style="WIDTH: 550px">
<P>当前位置:<A title=首页 href="http://www.cnithr.com/">首页</A> &gt; 注册个人会员</P></DIV><!-- 个人注册表单区域 -->
<FORM name=userReg action=user_register_login.php method=post>
<DIV id=preg>
<DL>
  <DT id=top><IMG src="img/preg01.gif"> </DT>
  <DD>
  <DIV>
  <P class=th>用 户 名: </P>
  <P>
  <INPUT class=intext id=reg_pname οnblur=lostFocus(this) οnfοcus=intoFocus(this) name=userName>
  </P></DIV>
  <DIV>
  <P class=right id=hint_reg_pname>合法的用户名应该由a-z的小写英文字母、0-9的数字或下划线组成,长度应在4-25个字符之间,请勿使用空格,选择不会引起歧义的用户名。</P></DIV></DD>
  <DD>
  <DIV>
  <P class=th>密  码:</P>
  <P><INPUT class=intext id=reg_ppass1 οnblur=lostFocus(this)
  οnfοcus=intoFocus(this) type=password name=user_passwd> </P></DIV>
  <DIV> <P class=right  id=hint_reg_ppass1>密码可使用任何英文字母及阿拉伯数字组合,不得少于6个字符,并区分英文字母大小写。</P></DIV></DD>
  <DD>
  <DIV>
  <P class=th>确认密码:</P>
  <P><INPUT class=intext id=reg_ppass2 οnblur=lostFocus(this)
  οnfοcus=intoFocus(this) type=password name=password> </P></DIV>
  <DIV>
  <P class=right id=hint_reg_ppass2>再次输入密码</P></DIV></DD>
  <DD>
  <DIV>
  <P class=th>电子邮件:</P>
  <P><INPUT class=intext id=reg_pmail οnblur=lostFocus(this)
  οnfοcus=intoFocus(this) name=emailaddress> </P></DIV>
  <DIV>
  <P class=right id=hint_reg_pmail>推荐使用<A style="COLOR: yellow"
  href="http://mail.cn.yahoo.com/?id=40160"
  target=_blank>Yahoo不限量邮箱</A>。</P></DIV> </DD>
  <DD>
  <DIV>
  <P class=th>验 证 码:</P>
  <P></P>
  <DIV style="MARGIN-RIGHT: 2px">
  <INPUT class=intext id=reg_code name="VerifyCode"
  οnblur=lostFocus(this) style="WIDTH: 68px" οnfοcus=intoFocus(this)
  name=check_code>
 </DIV>
  <DIV>
 <img id=img_reg_code src="VerifyCode.jsp"  style="cursor: hand">
  </DIV>
  <P></P></DIV>
 
  <DIV>
  <P class=right id=hint_reg_code>请输入验证码。<SPAN style="CURSOR: pointer"
  οnclick=win_regcode_reload();><U class=yellowz>看不清?换一张</U></SPAN> </P></DIV>
  <DT>
  <DIV id=bottom><IMG src="img/preg05.gif"></DIV></DT></DL>
<DIV style="WIDTH: 100%; PADDING-TOP: 10px; BACKGROUND-COLOR: #fff; TEXT-ALIGN: center"><INPUT
οnclick="return check_reg_frm();" type=image alt=同意以下条款,提交注册信息
src="img/btn_psubmit1.gif">
</DIV></DIV>
</FORM>
<SCRIPT language=JavaScript type=text/JavaScript>
 document.getElementById('reg_pname').focus();
</SCRIPT>
</BODY></HTML>


userreg.js
function intoFocus(obj){
 win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_'+obj.id,'in');  //填写提示信息,和信息的样式控制
 
}
function check_reg_frm(){  //提交表单
 
 if( !win_test_reg_pname() ) { return false; }
 if( !win_test_reg_ppass1() ) { return false; }
 if( !win_test_reg_ppass2() ) { return false; }
 if( !win_test_reg_pmail() ) { return false; }
 if( !win_test_reg_hangye() ) { return false; }
 if( !win_test_reg_code() ) { return false; }
return true;
}

function lostFocus(obj){  
 eval("win_test_"+obj.id+"()");  //失去焦点后检测格式正确还是不正确
}
function win_test_reg_pname(){       //检查用户名是否正确

 class="tags" href="/tags/SEARCH.html" title=search>search_str=document.getElementById('reg_pname').value;

 if(class="tags" href="/tags/SEARCH.html" title=search>search_str==''){
  //window.alert("请输入用户名!");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_pname','error');
     return false;
 }
    var re = new RegExp("^([//w//-//.]{4,25})$");
    if (class="tags" href="/tags/SEARCH.html" title=search>search_str.class="tags" href="/tags/SEARCH.html" title=search>search(re) == -1) {
        //window.alert ("请输入有效合法的用户名 !");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_pname','error');
        return false;
    }
    win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_pname','testing');
 return true;
}
function win_test_reg_ppass1(){   //检查密码是否正确
    var class="tags" href="/tags/SEARCH.html" title=search>search_str;
 class="tags" href="/tags/SEARCH.html" title=search>search_str=document.getElementById('reg_ppass1').value;
 if(class="tags" href="/tags/SEARCH.html" title=search>search_str==''){
  //window.alert("请输入用户密码!");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass1','error')
     return false;
 }
    var re = new RegExp("^([//w//-]{6,})$");
    if (class="tags" href="/tags/SEARCH.html" title=search>search_str.class="tags" href="/tags/SEARCH.html" title=search>search(re) == -1) {
        //window.alert ("请输入至少6位有效字符的用户密码 !");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass1','error')
        return false;
    }
 win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass1','right');
 return true;
}

function win_test_reg_ppass2(){   // //检查确认密码是否正确
    var class="tags" href="/tags/SEARCH.html" title=search>search_str;

 class="tags" href="/tags/SEARCH.html" title=search>search_str=document.getElementById('reg_ppass2').value;
 if(class="tags" href="/tags/SEARCH.html" title=search>search_str==''){
  //window.alert("请输入确认密码!");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass2','error')
     return false;
 }
    var re = new RegExp("^([//w//-]{6,})$");
    if (class="tags" href="/tags/SEARCH.html" title=search>search_str.class="tags" href="/tags/SEARCH.html" title=search>search(re) == -1) {
        //window.alert ("请输入请输入至少6位有效字符的确认密码 !");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass2','error')
        return false;
    }
 class="tags" href="/tags/SEARCH.html" title=search>search_str_1=document.getElementById('reg_ppass1').value;
 
 if(class="tags" href="/tags/SEARCH.html" title=search>search_str_1!=class="tags" href="/tags/SEARCH.html" title=search>search_str){
  //window.alert ("确认密码不一致,请重新输入确认密码 !");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass2','error');
  return false;
 }
 win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_ppass2','right');
 return true;
}

function win_test_reg_pmail(){  //检查邮箱是否正确
    var class="tags" href="/tags/SEARCH.html" title=search>search_str;
 class="tags" href="/tags/SEARCH.html" title=search>search_str=document.getElementById('reg_pmail').value;
 if(class="tags" href="/tags/SEARCH.html" title=search>search_str==''){
  //window.alert("请输入电子邮件!");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_pmail','error');
     return false;
 }
    var re = new RegExp("^([//w//-]+(?://.[//w//-]+)*@[A-Za-z0-9]+[//w//-]*(?://.[//w//-]+)+)$");
    if (class="tags" href="/tags/SEARCH.html" title=search>search_str.class="tags" href="/tags/SEARCH.html" title=search>search(re) == -1) {
        //window.alert ("请输入有效合法的电子邮件 !");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_pmail','error');
        return false;
    }
 win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_pmail','right');
 return true;
}

 

function win_test_reg_code(){  //检查验证码是否正确
    var class="tags" href="/tags/SEARCH.html" title=search>search_str;
 class="tags" href="/tags/SEARCH.html" title=search>search_str=document.getElementById('reg_code').value;
 if(class="tags" href="/tags/SEARCH.html" title=search>search_str==''){
  //window.alert("请输入正确的验证码!");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_code','error');
     return false;
 }
    var re = new RegExp("^([//d]{4})$"); //全数字的,怎么改成四个数字或字母的
    if (class="tags" href="/tags/SEARCH.html" title=search>search_str.class="tags" href="/tags/SEARCH.html" title=search>search(re) == -1) {
        //window.alert ("请输入正确的验证码 !");
  win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_code','error');
        return false;
    }
 win_into_class="tags" href="/tags/INPUT.html" title=input>input('hint_reg_code','right');
 return true;
}

function win_regcode_reload(){  //刷新验证码
  //alert("test");
 var obj_img=document.getElementById('img_reg_code');
 //var d = new Date();
 //var s =d.getHours()+"m"+d.getMinutes()+"s"+d.getSeconds();
 obj_img.src="VerifyCode.jsp?aa="+Math.random()+100;

}

function win_into_class="tags" href="/tags/INPUT.html" title=input>input(hintid,clsname){  //填写提示信息,和信息的样式控制
 
 var obj_div=document.getElementById(hintid);
 obj_div.className=clsname;
 var strgoodid =hintid.replace('hint','good');
 if(clsname=="in")
  obj_div.innerHTML=eval("arr_"+hintid+"[0]");
 if(clsname=="right") {
  obj_div.innerHTML=eval("arr_"+hintid+"[1]");
  if(hintid=="hint_reg_pname"){
   document.getElementById('reg_pname_userd').value=1;
  }
  document.getElementById(strgoodid).className="good"; 
 } else {
  document.getElementById(strgoodid).className="nogood"; 
 }
 if(clsname=="error")
  obj_div.innerHTML=eval("arr_"+hintid+"[2]");
 if(clsname=="beused") {
  obj_div.innerHTML=eval("arr_"+hintid+"[3]");
  document.getElementById(hintid).className="error"; 
 }
 if(clsname=="testing") {
  obj_div.innerHTML=eval("arr_"+hintid+"[4]");
   
 }
}

 // in     right  error beused          testing
//[0]提示;[1]正确;[2]错误;[3]已经存在;[4]判断中

var arr_hint_reg_pname= Array('合法的用户名应该由a-z的小写英文字母、0-9的数字或下划线组成,长度在4-25个字符之间,请勿使用空格键,请选择不会引起歧义的用户名',    
'用户名可以使用。',
'  填写错误!合法的用户名应该由a-z的小写英文字母、0-9的数字或下划线组成,长度应在4-25个字符之间',
'  用户名已经存在!请重新填写新的用户名。','正在校验名称是否已经存在...' );

var arr_hint_reg_ppass1= Array('密码可使用任何英文字母及阿拉伯数字组合,不得少于6个字符,并区分英文字母大小写',    
'填写正确。',
'  填写错误!密码可使用任何英文字母及阿拉伯数字组合,不得少于6个字符,并区分英文字母大小写',
'','' );
var arr_hint_reg_ppass2= Array('请重新输入一遍密码',    
'填写正确','  填写错误!请重新输入一遍密码',
'','' );
var arr_hint_reg_pmail= Array('请填写有效的E-mail邮箱地址,便于接收注册信息及找回丢失密码。<br/>推荐使用<a href="http://mail.cn.yahoo.com/?id=40160" target="_blank" style="color:red">Yahoo不限量邮箱</a>。',    
'填写正确。',
'  填写错误!请填写有效的E-mail邮箱地址,便于接收注册信息及找回丢失密码。推荐使用<a href="http://mail.cn.yahoo.com/?id=40160" target="_blank" style="color:red">Yahoo不限量邮箱</a>。',
'','' );
var arr_hint_reg_code= Array('请输入验证码。<A class=redz onClick="win_regcode_reload();"><U>看不清?换一张</U></A>',    
'验证码已填写。<A class=redz  onClick="win_regcode_reload();"><U>看不清?换一张</U></A>',
'  填写错误!请输入验证码。<A class=redz  onClick="win_regcode_reload();"><U>看不清?换一张</U></A>',
'','' );

 

未完成
使用ajax检测用户名是否存在

div> div> <div id="treeSkill">div>

http://www.niftyadmin.cn/n/1425720.html

相关文章

带QQ表情的留言

使用ajax从数据库中取qq表情图片对应的快捷方式 /se USE demo;CREATE TABLE qq ( id int(11) NOT NULL auto_increment, pic text, short varchar(11) default NULL, PRIMARY KEY (id)) TYPEMyISAM;INSERT INTO qq VALUES (1,qq/0.gif,wx); 有QQ表情的留言页<% page …

菜菜的刷题日记 | 238.除自身以外数组的乘积

系列索引&#xff1a;菜菜的刷题日记 | 被LeetCode用Python狂虐的那段日子 菜鸡的修仙之路——2022/1/12 文章目录【题目】【官方思路】【参考代码】【思考】【题目】 给你一个长度为 n 的整数数组 nums&#xff0c;其中 n > 1&#xff0c;返回输出数组 output &#xff0c…

学习充电中.....

学习充电中.....新闻系统的子系统可以自由开启评论功能对所有会员定期发送广告信息Rssajax框架dwrJSON(JavaScript Object Notation) 是XML的替代品 网站开发策划书?

菜菜的Python学习日记 | 几个比较有意思的代码(双色球机选、约瑟夫环问题、井字棋游戏)

系列索引&#xff1a;菜菜的Python学习日记 | Python从入门到入土详解 案例1&#xff1a;双色球选号。 from random import randrange, randint, sampledef display(balls):"""输出列表中的双色球号码"""for index, ball in enumerate(balls):…

菜菜的并发编程笔记 |(五)线程安全问题以及Lock解决方案

系列索引&#xff1a;菜菜的并发编程笔记 | Python并发编程详解&#xff08;持续更新~&#xff09; 文章目录一、线程安全概念介绍二、Lock用于解决线程安全问题三、代码详解一、线程安全概念介绍 二、Lock用于解决线程安全问题 第一种方式先手动获取&#xff0c;在执行完后手动…

oracle上机练习

oracle上机练习安装oracle9i, PL/SQL Developer图形界面工具 全局数据库名称:pp系统标识符: ppsys口令: change_on_installsystem口令 : manager 1.创建用户和授权打开工具 oracle sql *plus使用system和口令,数据库名称登陆进去;CREATE USER pp IDENTIFIED BY mm ; 密码为9…

买书 el标签使用中

企业级java开发与架构 专业程序员在实战中的蜕变基于j2ee的ajax; 电子拍卖系统 struts含ajax,输入校验, struts2权威指南 李刚 java实用组件集 校验组件 JAVA实用组件集http://www.jrsoft.com.cn/html/download.asp jsp的标签使用(jstl)<%taglib uri"http://ja…

菜菜的并发编程笔记 |(九)异步IO实现并发爬虫加速

系列索引&#xff1a;菜菜的并发编程笔记 | Python并发编程详解&#xff08;持续更新~&#xff09; 文章目录一、思维导图&#x1f467;二、什么是协程&#xff1f;三、Python 异步IO库介绍&#xff1a;asyncio四、异步编程的威力五、异步编程核心原理六、异步编程代码示例七、…