注册界面实例---千里IT学会的招新报名活动页

吼吼.......千里IT学会的招新报名活动页设计完毕,呀吼吼吼......为避免某些熊孩子图谋不轨影响招新数据的有效性暂不公布网址,附抢先预览图一张


代码如下:

注册页面代码:

<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="shortcut icon" href="favicon.ico" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>千里IT招新报名</title>
</head>

<style >
<!--
body { margin: 0px; }
#maintable{ border:#333 1px solid; margin:0 auto;}
tr{ text-align:center;}
#texttd{ font-size:14px; color:#EC6826; font-weight:bold; text-align:center; }
.colordiv{
	height:650px;
}
a{ text-decoration:none;}
h1{ font-family: "华文行楷"; font-size:130px; color: #FFFFFF; text-align:center; padding-top:150px; margin:0 auto; font-weight:100;}
h3{ font-family: "华文行楷"; font-size:80px; color: #FFFFFF; text-align:center; margin:0 auto; font-weight:bold; padding-top:80px;}
td{ height:35px; }
h4{ font-family: "幼圆"; font-size:36px; color:#FFFFFF; text-align:left; padding-left:37%;}
</style>
<script language="javascript"  >
function checklogin(username,password,email,tel,qq,dormitory,strong){
	username = username.replace(/(^\s*)|(\s*$)/g, "");
	password = password.replace(/(^\s*)|(\s*$)/g, "");
	email = email.replace(/(^\s*)|(\s*$)/g, "");
	qq = qq.replace(/(^\s*)|(\s*$)/g, "");
	dormitory = dormitory.replace(/(^\s*)|(\s*$)/g, "");
	tel = tel.replace(/(^\s*)|(\s*$)/g, "");

	if (username == null|| username =="" || username == "我是姓名仔 / 楼下是密码君" ){
			alert("你丫姓名都懒得写啊!");
			win.username.focus();
			return false;
		}
	if (password == null||password == "" || password == "我是密码君 / 楼下是邮箱仔"){
			alert("妈蛋!密码呢?!");
			win.password.focus();
			return false;
		}
		
	if (email == null||email == "" || email == "人不知而不愠,不亦君子乎"  ){
			alert("魂淡!!邮箱呢?!!");
			win.email.focus();
			return false;
		}else if(!email.match( /^[_a-zA-Z0-9\-\.]+@([\-_a-zA-Z0-9]+\.)+[a-zA-Z]{2,3}$/)){
		alert("你逗我?!这货是邮箱?!");
			win.email.focus();
			return false;
		}
	
	if (tel == null||tel == "" || tel == "楼上是邮箱仔 / 我是Tel君"  ){
			alert("留个手机号又不会怀孕?!");
			win.tel.focus();
			return false;
		}
	if (qq == null||qq == "" || qq == "我是扣扣君....一只企鹅屁颠屁颠的飘过...."){
			alert("我保证不在你的空间打小广告好不好?!");
			win.qq.focus();
			return false;
		}	

	if (dormitory == null|| dormitory =="" || dormitory == "我是寝室思密达,我不会做坏坏事情的" ){
			alert("我不会半夜找你的!!妥妥的!");
			win.dormitory.focus();
			return false;
		}
	if (strong == null|| strong =="" || strong == "你的特殊技能神奇之处终极装备必杀技等....." ){
			alert("你就没一点特长?!实在不行特能吃也算!0.0");
			win.strong.focus();
			return false;
		}	
	if ((!win.r1.checked)&&(!win.r2.checked)&&(!win.r3.checked)&&(!win.r4.checked)){
			alert("咳咳!!亲,请选择你意向加入的小组!你可是干大事的人怎么能忘了这茬?!");
			return false;
	}
	
}
</script>
<%--banner--%>
<div class="colordiv" style="background: #009fb8" align="center" >
<h1>千里IT招新啦!</h1>
<a href="index1.html" title="猛戳我们进入千里IT工坊"><img src="images/bb/3.ico"  style="margin-top:50px"/>
<img src="images/bb/33.ico" />
<img src="images/bb/74.ico" />
<img src="images/bb/32.ico"/></a>
</div>
<div class="colordiv" style=" background:#00b271;">
<h3 style="color: #F82756 ">技术组</h3>
<h4>高攻高防,肉盾型角色</h4>
<h4>主攻编程,刷怪必备</h4>
<h4>成长路线:程序猿→总经理</h4>
<h4>上手难度:★★★★</h4>
</div>
<div class="colordiv" style=" background:#8080c0;">
<h3 style="color: #FB7D00">产品组</h3>
<h4>高信息量,综合型角色</h4>
<h4>接触面广,联通小组的桥梁</h4>
<h4>成长路线:PB→总经理</h4>
<h4>上手难度:★★★☆</h4>
</div>
<div class="colordiv" style=" background: #99CC00;">
<h3 style="color: #FFFF15">设计组</h3>
<h4>装备总经销商,法师型角色</h4>
<h4>化腐朽为神奇神奇奇神奇~~</h4>
<h4>成长路线:美工→总经理</h4>
<h4>上手难度:★★★★</h4>
</div>
<div class="colordiv" style=" background: #FF9933;">
<h3 style="color: #0099FF">运营组</h3>
<h4>外向型角色,较强公关能力</h4>
<h4>三寸不烂之舌,舌战群儒之势</h4>
<h4>成长路线:OM→总经理</h4>
<h4>上手难度:★★★☆</h4>
</div>
<div class="colordiv" style="height: 1200px">
<img src="images/ins1000newmember.png" style="position:relative; left:25%;float:left;" />
</div>"
<div class="colordiv" style="margin:0px auto 0 auto; background: #CCCCCC; height:620px;">
<h3></h3>
<form id="win" name="win" method="post" οnsubmit="return checklogin(win.username.value,win.password.value,win.email.value,win.tel.value,win.qq.value,win.dormitory.value,win.strong.value)" action="registersuccess.jsp">
  <table width="400" id="maintable" bgcolor="#FFFFFF">
    <tr>
      <th height="45" bgcolor="#2F3436" style="color:#FFFFFF"><h2>千里IT--报名</h2></th>
    </tr>
	<tr>
	<td style="height:10px">
	</td>
	</tr>
    <tr>
      <td  id="texttd"> 姓名:
        <input name="username" type="text" id="username"value="我是姓名仔 / 楼下是密码君" οnclick="if(this.value == '我是姓名仔 / 楼下是密码君'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '我是姓名仔 / 楼下是密码君';}" style="color: #999999" size="40" maxlength="40"/></td>
    </tr>
    <tr>
       <td id="texttd"> 密码:
        <input name="password" type="text" id="password" size="40" maxlength="40" value="我是密码君 / 楼下是邮箱仔" οnclick="if(this.value == '我是密码君 / 楼下是邮箱仔'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '我是密码君 / 楼下是邮箱仔';}" style="color: #999999" onk οnkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"/>
		</td>
    </tr>
    <tr>
       <td id="texttd"> 邮箱:
        <input name="email" type="text" id="email" size="40" maxlength="80" value="人不知而不愠,不亦君子乎" οnclick="if(this.value == '人不知而不愠,不亦君子乎'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '人不知而不愠,不亦君子乎';}" style="color: #999999"/></td>
    </tr>
	  <tr>
       <td id="texttd"> 手机:
        <input name="tel" type="text" id="tel" size="40" maxlength="40" value="楼上是邮箱仔 / 我是Tel君" οnclick="if(this.value == '楼上是邮箱仔 / 我是Tel君'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '楼上是邮箱仔 / 我是Tel君';}" style="color: #999999" οnkeyup="value=value.replace(/[\W]/g,'') "   
onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"/></td>
	  </tr>
	  
	  <tr>
       <td id="texttd"> 扣扣:
        <input name="qq" type="text" id="qq" size="40" maxlength="40" value="我是扣扣君....一只企鹅屁颠屁颠的飘过...." οnclick="if(this.value == '我是扣扣君....一只企鹅屁颠屁颠的飘过....'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '我是扣扣君....一只企鹅屁颠屁颠的飘过....';}" style="color: #999999" οnkeyup="value=value.replace(/[^\d]/g,'') "   
onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /></td>
	  </tr>
	  
	  <tr>
       <td id="texttd"> 寝室:
        <input name="dormitory" type="text" id="dormitory" size="40" maxlength="40" value="我是寝室思密达,我不会做坏坏事情的" οnclick="if(this.value == '我是寝室思密达,我不会做坏坏事情的'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '我是寝室思密达,我不会做坏坏事情的';}" style="color: #999999"/></td>
	  </tr>
	  
      <tr>
         <td height="47"  id="texttd"> 特长:
         <input name="strong" type="text" id="strong" size="40" maxlength="80" value="你的特殊技能神奇之处终极装备必杀技等....." οnclick="if(this.value == '你的特殊技能神奇之处终极装备必杀技等.....'){this.value = '';}else {this.select();}" οnblur="if(this.value == ''){this.value = '你的特殊技能神奇之处终极装备必杀技等.....';}" style="color: #999999"/></td>
      </tr>
	  
	  <tr>
       <td id="texttd" style="color:#3366FF">
         <label>
         <input type="radio" name="zu" value="技术组" id="r1" />
         </label>技术组
         <label>
         <input type="radio" name="zu" value="产品组" id="r2" />
         产品组
         <input type="radio" name="zu" value="设计组" id="r3" />
         设计组
         <input type="radio" name="zu" value="运营组" id="r4" />
         </label>运营组
	  </tr>

	  <tr>
	<td style="height:10px">
	</td>
	</tr>
      <tr>
      <td><input type="submit" name="Submit" value="提         交" style=" width:400px; height:70px; color:#FF0000; cursor:pointer; font-size:24px;background-color:#2F3436; font-weight:bold"/></td>
      </tr>
	  
  </table>
</form>
</div>
</body>
表单处理数据

<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>千里IT招新报名</title>
</head>
<body>

<%
Connection conn = null;
PreparedStatement stmt = null;
ResultSet rs = null;
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
String sql = null;
String g = null;
g = request.getParameter("zu");
try{
	Class.forName("com.mysql.jdbc.Driver");
	String url = "jdbc:mysql://localhost/users?useUnicode=true&characterEncoding=UTF-8";
	conn = DriverManager.getConnection(url,"root","");
	sql = "select * from users where users.username= ? ";
	stmt = conn.prepareStatement(sql);
	stmt.setString(1,request.getParameter("username"));
	
	rs =stmt.executeQuery();
	if(rs.next()){
	out.println("额..你和某位妹子或者汉子撞衫了,对方已提前注册了你的姓名商标...."+"<br />"+"<br />");
	response.setHeader("Refresh","3;url=index.jsp");
	return;
	}
	
   sql = "insert into users (username,password,email,tel,qq,dormitory,strong,zu) values (?,?,?,?,?,?,?,?)";
   
	stmt = conn.prepareStatement(sql);
	stmt.setString(1,request.getParameter("username"));
	stmt.setString(2,request.getParameter("password"));
	stmt.setString(3,request.getParameter("email"));
	stmt.setString(4,request.getParameter("tel"));
	stmt.setString(5,request.getParameter("qq"));
	stmt.setString(6,request.getParameter("dormitory"));
	stmt.setString(7,request.getParameter("strong"));
	stmt.setString(8,g);
	stmt.executeUpdate();
	out.println("咳咳....小子运气不错,报名成功....."+"<br />"+"<br />");
	out.println("默数3秒将有神奇的事情发生......"+"<br />"+"<br />");
	out.println("如果没有发生请关机重启电脑......");
	response.setHeader("Refresh","3;url=index1.html");
		}catch (ClassNotFoundException e){
				out.println("咳咳....服务器正在升级,"+"<br />"+"<br />"+"请稍后访问,即使它不是在升级....."+"<br />"+"<br />");
				out.println("默数3秒将有神奇的事情发生......");
				response.setHeader("Refresh","3;url=../index1.html");
			}catch(SQLException e){
				out.println("咳咳....服务器正在升级,"+"<br />"+"<br />"+"请稍后访问,即使它不是在升级....."+"<br />"+"<br />");
				out.println("默数3秒将有神奇的事情发生......");
				response.setHeader("Refresh","3;url=../index1.html");
			}finally{
				try{
					if (rs!=null){
						rs.close();
						rs=null;
					}
					if (stmt!=null){
						stmt.close();
						stmt=null;
					}
					if (conn!=null){
						conn.close();
					}
					
				}catch(SQLException e){
					out.println("咳咳....服务器正在升级,"+"<br />"+"<br />"+"请稍后访问,即使它不是在升级....."+"<br />"+"<br />");
					out.println("默数3秒将有神奇的事情发生......");
					response.setHeader("Refresh","3;url=../index1.html");
				}
				
			}
%>
</body>
</html>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值