[置頂] 工作筆記5.JAVA文本框驗證碼
來源:程序員人生 發布時間:2014-11-08 08:05:12 閱讀次數:2464次
本文主要內容為:利用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="換1張"
style="width: 68px; height: 27px; cursor:not-allowed" />
</s:form>
</body>
生活不易,碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈