标签:验证码
本文主要内容为:利用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 onload="javascript:createCode();"> <s:form action="user_login" onsubmit="return check()"> <input type="text" id="code" class="dz" style="width: 110px;" /> <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="code" title="换一张" style="width: 68px; height: 27px; cursor:not-allowed" /> </s:form> </body>
标签:验证码
原文地址:http://blog.csdn.net/zhaolijing2012/article/details/40590777