客户端验证码框架——jquery real person 。


首先需要在先官网站里找到realPerson 框架的jquery库。
<script language="javascript" src="jquery-1.4.1.min.js"></script>
<link href="jquery.realperson.css" type="text/css" rel="Stylesheet" />
<script language="javascript" src="jquery.realperson.js"></script>
一.好了现在可以实现神奇的客户端验证框架了,如下:
<input id="loginRealperson" type="text" />
<script language="javascript" type="text/javascript">
$(function(){
$("#loginRealPerson").realPerson(
   {
     length:6,//设定验证码字符长度
     includerNumbers:true, //是否引入数字格式
     regenerate:"点击刷新验证码!" //提示语
   }
);
});
</script>
运行你的html页面,会出现验证码。
加入需要在客户端进行比对验证码,建议自己方法
jQuery.getHashNumber=function(value){
var hash = 5381;
value=value.toUpperCase();
for (var i = 0; i < value.length; i++) {
hash = ((hash << 5) + hash) + value.charCodeAt(i);
}
return hash;
}
利用以上方法返回值与生成验证码号码——var generateNum = $(".realperson-hash").val();进行比对。
二.如果想提交到服务器端则需要将
页面验证码文本框内容
var loginRealPerson  = $("#loginRealperson").val();
作为参数传递到服务器端进行比对
服务器端需要创造一个算法与loginRealPerson 进行比对。
private String rpHash(String value) {
int hash = 5381;
value = value.toUpperCase();
for(int i = 0; i < value.length(); i++) {
hash = ((hash << 5) + hash) + value.charAt(i);
}
return String.valueOf(hash);
}
(注意:jquery real person 对IE6 不兼容,建议有在使用IE6的童鞋选择其它方案。——IE6会将打印出来的“*”拉的很宽,超级难看的。除非你可以对realPerson框架进行修改。)

希望对大家有帮助。


jquery real person 包见附件