When we do the verification code often because of the cheat, the verification sometimes deliberately add a lot of interference factors, then the verification code display is not very clear, users often input errors. This will not only refresh the page, causing the user did not see the verification code and refill rather than modify, and if not with the session to save the user input of other data (such as name), the user has just entered the content does not exist, this gives users a bad experience.
This example in the original verification method on the basis of adding a JS, through XMLHTTP to get the return value, in order to verify the validity, so that even if the user browser does not support JS, it will not affect his normal use.
In order to prevent cheating, when the user connected 3 times the input error to reload the picture, which is also conducive to the user because of the image of the verification code can not be clearly identified and eventually unable to enter the correct.
This example is also particularly suitable to verify that the user name is valid, as long as a SQL query from the background, return a value or XML. (There are too many of these examples here.)
The advantage of this example is very convenient for user input, but also reduce the server-side requests, can be said to improve the user experience and a bit of savings in bandwidth costs, but accordingly to add a section of JavaScript code on the page, in the current faster speed people demand convenient and comfortable today, It seems that we should pay more attention to provide users with a good sense of use.
Code as follows,
1, img.jsp, enter the main page
Program code
<%@ page contenttype= "text/html; CHARSET=GBK "Language=" Java "
Import= "java.sql.*" errorpage= "" pageencoding= "GBK"%>
<%
Set Chinese Char
Cody by JarryLi@gmail.com;
Homepage:jiarry.126.com
Request.setcharacterencoding ("GBK");
Response.setcharacterencoding ("GBK");
Response.setcontenttype ("text/html; CHARSET=GBK ");
%>
<title> Photo Validation </title>
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 ">
<script src= "Net.js" ></script>
<body>
AJAX (no refresh prompt) Verification code instance! Cody by Jarry
<%
String num=request.getparameter ("num");
String random= (String) session.getattribute ("random");
String name=request.getparameter ("name");
if (num!=null&&random!=null&&name!=null)
{
if (num.equals (random))
{
Out.println ("<font style=" Color:green;font-weight:bold ">
Congratulations, the verification code entered successfully, here is the results page, you can write to the database! </font>
<a href= "img.jsp" > Return Test </a><br> ");
Out.println ("Your name is:" +name);
Out.println ("<br>");
OUT.PRINTLN ("You entered is:" +num);
Out.println ("Verification Code is:" +random);
Out.println ("</body>");
Return;//javascript:history.go (-1)
}
}
%>
<script type= "Text/javascript" >
var times=0;
Function Subform () {
var Gtext=this.req.responsetext;
var Info=document.getelementbyid ("info");
if (Gtext.indexof ("validate_successful")!=-1) {
Info.innerhtml= "<font color=green> Verification code through </font>";
document.forms["MyForm"].submit ();
When the resulting value is valid, the validation code passes.
}elseelse{
Info.innerhtml= "+times+" error, please note that case sensitive ";
}
document.forms["MyForm"].num.select ();
}
}
function Validata (obj) {
var enter=true;
var Info=document.getelementbyid ("info");
var msg= "";
if (Obj.name.value.match (/^s*$/g))
if (Obj.num.value.match (/^s*$/g)) {//If no verification code is entered, prompt
msg+= "Please enter the verification code <br>"; enter=false
}
if (Enter==false) {
info.innerhtml=msg;
return false;
}
var url= "num.jsp?num=" +obj.num.value;
var newxmlhttp=new net. Contentloader (Url,subform, "", "get", null,null);
return false;
}
function Show (o) {
Overload Verification Code
var timenow = new Date (). GetTime ();
O.src= "random.jsp?d=" +timenow;
/*
Overtime execution;
settimeout (function ()
, 20);
*/
}
</script>
<form action= "img.jsp" name= "MyForm" method= "POST"
Onsubmit= "return Validata (this);" >
Your name: <input type= "text" name= "name" size=10> (to better illustrate this example, winter name one) <br>
Verification code: <input type= "text" name= "num" size=10 maxlength= "4" >
<a href= "Javascript:show (document.getElementById (' Random '))" > Verification code not clear </a><br>
<br> <input type= "Submit" value= "submitted" ><br>
<div id=info style= "COLOR:RED;PADDING:10PX;FONT-SIZE:12PX;" ></div>
</form>
</body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
