JavaWeb04(验证码&登录&新闻增加)

最新推荐文章于 2024-07-24 17:27:32 发布

巴枝子

最新推荐文章于 2024-07-24 17:27:32 发布

阅读量78

点赞数 1

文章标签： java

本文链接：https://blog.csdn.net/fddggghrr/article/details/123858924

版权

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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=gb2312" />
<title>用户登录</title>
<link href="images/login.css" rel="stylesheet" type="text/css" />
<!--引入jQuery的类库  -->
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<!--另起一个script块 -->
<script type="text/javascript">
//页面载入函数
$(function(){
	myf();
	//给验证码增加点击事件
	$("#yzm").click(function){
		myf();//刷新
	});
})

//随机验证码=刷新验证码
function myf(){
	//数组下标:0-33
    var arr = new Array(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');//所有候选组成验证码的字符，当然也可以用中文的
    //js的随机数 无限逼近0-1的小数  逼近0-33 四舍五入
    var str=" ";//拼接
   for(var i=0;i<4;i++){
	   var a=math.random(math.random()*33);//随机下标
	   // console.info(arr[a]);//根据下表取元素
	    str+=arr[a];//自身拼接
   }
   //给span赋值
    $("#yzm").html(str);//赋值
}

//验证登录
function yzLogin(){
	//依次取用户名、密码、输入的验证码以及随机产生的验证码
	var name=$("#xx").val;
	var pwd=$("#yy").val;
	var yzm1=$("#zz").val;
	var yzm2=$("#yzm").html;//拿值
	if(name==""){
		alert("用户名不能为空");
		return false;
	}
	if(pwd==""){
		alert("密码不能为空");
		return false;
	}
	if(yzm1==""){
		alert("验证码不能为空");
		return false;
	}
	else{//说明验证码不为空的情况下
		//实现验证码不区分大小写
		if(yzm1==yzm2){//不一致
			alert("验证码有误");
		myf();//刷新验证码
		$("#zz").val("");//清空文本框
		return false;
		}
		
	}
	return true;	
}
</script>
</head>
<body>
 <form action="dologin.jsp" method="post" onsubmit="return yzLogin()">

    <div id="login">
    
	     <div id="top">
		      <div id="top_left"><img src="images/login_03.gif" /></div>
			  <div id="top_center"></div>
		 </div>
		 
		 <div id="center">
		      <div id="center_left"></div>
			  <div id="center_middle">
			       <div id="user">用 户
			         <input type="text" name="aa" id="xx"/>
			       </div>
				   <div id="password">密   码
				     <input type="password" name="bb" id="yy"/>
				   </div>
				    <div id="password">验证码
				     <input id="zz" style="width:30px;" type="text" name="cc" />&nbsp;&nbsp;
				    <span id="yzm" style="color:red;font-size:18px;cursor:pointer;">xxxx</span>
				   </div>
				   <div id="btn">
				   <!-- <a href="#">登录</a>
				   <a href="#">清空</a> -->
				   <input type="submit" value="登录"/>
				   <input type="reset" value="清空"/>
				   </div>
			  
			  </div>
			  <div id="center_right"></div>		 
		 </div>
		 <div id="down">
		      <div id="down_left">
			      <div id="inf">
                       <span class="inf_text">版本信息</span>
					   <span class="copyright">管理信息系统 2008 v2.0</span>
			      </div>
			  </div>
			  <div id="down_center"></div>		 
		 </div>

	</div>
	</form>
</body>
</html>

巴枝子

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaWeb04(验证码&登录&新闻增加)

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://ww...
复制链接

扫一扫