本文介绍的jQuery插件有点特殊,防自动提交表单的验证工具,就是我们经常用到的验证码工具,先给大家看看效果。
效果图如下:
使用说明
需要使用jQuery库文件和Real Person库文件
同时需要自定义验证码显示的CSS样式
使用实例
1、包含文件部分
<script type="text/javascript" src="jquery-latest.pack.js"></script>
<script type="text/javascript" src="jquery.realperson.js"></script>
<style type="text/css">@import "jquery.realperson.css";</style>
2、HTML部分
<input type="text" id="biuuu" name="defaultReal">
3、Javascript部分
$("#biuuu").realperson();
如上实例,就可以实现一个防自动提交表单的验证码工具,同时可指定验证码字符的长度,如下:
$("#biuuu").realperson({length: 5});
今天所讲到的jQuery Real Person Plugin,就是一个完全由JavaScript编写而成的jQuery验证码插件。
jQuery插件Real Person 点击可刷新实例讲解
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.realperson.js"></script> <link href="jquery.realperson.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(function(){ $('#Gideon').realperson({length: 5}); }) </script> </head> <body> <input type="text" id="Gideon" name="defaultReal"> </body> </html>
注:如果持续无法验证成功的话,请尝试下面的方法:
<?php function rpHash($value) { $hash = 5381; $value = strtoupper($value); for($i = 0; $i < strlen($value); $i++) { $hash = (($hash << 5) + $hash) + ord(substr($value, $i)); } return $hash; } ?>
替换为:
<? function rpHash($value) { $hash = 5381; $value = strtoupper($value); for($i = 0; $i < strlen($value); $i++) $hash = (leftShift32($hash, 5) + $hash) + ord(substr($value, $i)); return $hash; } function leftShift32($number, $steps) { $binary = decbin($number); $binary = str_pad($binary, 32, "0", STR_PAD_LEFT); $binary = $binary.str_repeat("0", $steps); $binary = substr($binary, strlen($binary) - 32); return ($binary{0} == "0" ? bindec($binary) : -(pow(2, 31) - bindec(substr($binary, 1)))); } ?>
以上就是为大家介绍了jQuery验证码插件Real Person的使用方法,小编整理的可能有些不全面,希望大家多多谅解。
目前支持对以下格式的值进行验证: cnum*-*(纯数字), char*-*(纯字母), zwen*-*(中文), bysc*-*(字母开头), mail(邮箱), yzbm(邮政编码) * 其中的‘*’表示长度,比如“zwen1-5”表示中文1-5位的长度。同时支持“zwen”(只能是中文),“zwen5-*”(5位长度的文字),其他的数据类型如同上面所示。
本文向大家介绍AngularJS自动表单验证,包括了AngularJS自动表单验证的使用技巧和注意事项,需要的朋友参考一下 AngularJS的另外一种表单验证方式是自动验证,即通过directive来实现,除了AngularJS自带的directive,还需要用到angular-auto-validate这个第三方module。 有关angular-auto-validate: 安装:npm i
本文向大家介绍AngularJS实现表单手动验证和表单自动验证,包括了AngularJS实现表单手动验证和表单自动验证的使用技巧和注意事项,需要的朋友参考一下 AngularJS的表单验证大致有两种,一种是手动验证,一种是自动验证。 一、手动验证 所谓手动验证是通过AngularJS表单的属性来验证。而成为AngularJS表单必须满足两个条件: 1、给form元素加上novalidate="no
问题内容: 我一直在尝试React。在我的实验中,我正在使用Reactstrap框架。当我单击按钮时,我注意到HTML表单已提交。有没有一种方法可以防止单击按钮时提交表单? 我在这里重新创建了我的问题。我的表单很基本,看起来像这样: 我想念什么? 问题答案: 我认为首先要注意的是,如果没有javascript(纯HTML),则在单击或时会提交元素。在javascript中,您可以通过使用事件处理程
我正在做一个Django项目,其中一个表单不会提交。我发现罪魁祸首是一些JavaScript,它格式化了货币输入(当我移除JS或移除输入时,它提交) 这是我的简化表单--JS来自html5货币/货币输入
本文向大家介绍ThinkPHP表单自动提交验证实例教程,包括了ThinkPHP表单自动提交验证实例教程的使用技巧和注意事项,需要的朋友参考一下 本文以实例讲述了ThinkPHP表单自动提交验证的实现过程,详细步骤如下所示: 一、模板部分: 二、模型部分form类程序代码: 三、控制器部分indexaction类程序代码: