Home  >  Article  >  Web Front-end  >  jQuery Real Person verification code plugin prevents form from automatically submitting_jquery

jQuery Real Person verification code plugin prevents form from automatically submitting_jquery

WBOY
WBOYOriginal
2016-05-16 15:33:271187browse

The jQuery plug-in introduced in this article is a bit special. A verification tool to prevent automatic form submission is the verification code tool we often use. Let me show you the effect first.

The rendering is as follows:


Instructions for use
Need to use jQuery library file and Real Person library file
At the same time, you need to customize the CSS style for verification code display

Usage examples

1. Containing file part
eb5ed3af5a776cc458426ea330eea2582cacc6d41bbb37262a98f745aa00fbf0
c08ed8948cb0aed87ccdc679547de9352cacc6d41bbb37262a98f745aa00fbf0
080b747a20f9163200dd0a7d304ba388@import "jquery.realperson.css";531ac245ce3e4fe3d50054a55f265927
2. HTML part
1de88d460a79b8e93c04f2361990d30b
3. Javascript part
$("#biuuu").realperson();
As shown in the above example, you can implement a verification code tool that prevents automatic form submission. At the same time, you can specify the length of the verification code characters, as follows:
$("#biuuu").realperson({length: 5});

The jQuery Real Person Plugin we talked about today is a jQuery verification code plug-in written entirely in JavaScript.

jQuery plug-in Real Person Click to refresh the example explanation

<!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>  

Note: If the verification continues to fail, please try the following method:

<&#63;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; 
} 
&#63;>  
Replace

with:

<&#63; 
  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" &#63; bindec($binary) : -(pow(2, 31) - bindec(substr($binary, 1))));  
  } 
&#63;> 

The above is an introduction to how to use the jQuery verification code plug-in Real Person. The editor may not have compiled it comprehensively. I hope you can understand it.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn