工作笔记5.JAVA文本框验证码

最新推荐文章于 2021-06-04 08:57:56 发布

chestnut_lan

最新推荐文章于 2021-06-04 08:57:56 发布

阅读量1.9k

点赞数

分类专栏：项目经验文章标签：验证码

本文链接：https://blog.csdn.net/zhaolijing2012/article/details/40590777

版权

项目经验专栏收录该内容

4 篇文章 0 订阅

订阅专栏

本文主要内容为：利用JAVA文本框制作验证码。

设计思路：

1、页面加载时，自动生成验证码。

2、后JS判定验证码是否输入正确

优点：

代码简洁，便于使用。页面中可直接判定验证码的正确性，无需传到后台Action中。

缺点：

由于本验证码是由text制作，容易被浏览器抓取/手动copy，丢失了其本质特性（安全性）。

<script type="text/javascript">
	var code ; //在全局 定义验证码
	function createCode()
	{        
		code = "";
		var codeLength = 4;//验证码的长度
		var checkCode = document.getElementById("checkCode");
		var selectChar = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','J','K','L','M','N','P','Q','R','S','T','U','V','W','X','Y','Z');// 所有候选组成验证码的字符，当然也可以用中文的
		 
		for(var i=0;i<codeLength;i++)
		{   
			var charIndex = Math.floor(Math.random()*34);
			code +=selectChar[charIndex];         
		}
		
		if(checkCode)
		{
			checkCode.className="code";
			checkCode.value = code;
		}
		 document.getElementById("code").focus();
	}
	
	function check()
	{          
		if(document.getElementById("code").value.replace(/\\s/g,'') != code )
		{
			alert("验证码输入错误！区分大小写");
			createCode();//刷新验证码
			document.getElementById("code").focus();
			return false;
		}
  
	}

</script>

</pre><pre code_snippet_id="501094" snippet_file_name="blog_20141029_2_4692873" name="code" class="html"><body οnlοad="javascript:createCode();">
	<s:form action="user_login"  οnsubmit="return check()">			
		<input type="text" id="code" class="dz" style="width: 110px;" />									
		<input type="text" οnclick="createCode()" readonly="readonly" id="checkCode" class="code" title="换一张"
			style="width: 68px; height: 27px; cursor:not-allowed" />
	</s:form>
</body>

chestnut_lan

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
10
评论
工作笔记5.JAVA文本框验证码

本文主要内容为：利用JAVA文本框制作验证码。设计思路：1、页面加载时，自动生成验证码。2、后JS判定验证码是否输入正确优点：代码简洁，便于使用。页面中可直接判定验证码的正确性，无需传到后台Action中。缺点：由于本验证码是由text制作，容易被浏览器抓取/手动copy，丢失了其本质特性（安全性）。
复制链接

扫一扫