Maison  >  Article  >  interface Web  >  jQuery Ajax affiche les bons et les mauvais numéros pour vérifier si le code de vérification d'entrée est correct

jQuery Ajax affiche les bons et les mauvais numéros pour vérifier si le code de vérification d'entrée est correct

韦小宝
韦小宝original
2018-01-01 19:44:302571parcourir

Cet article présente principalement jQuery Ajax pour afficher les nombres corrects et incorrects afin de vérifier si le code de vérification d'entrée est correct. Les amis intéressés par ajax peuvent se référer à cet article !

Sans plus tarder, je vais juste poster le code pour vous. Le code spécifique est le suivant :


<script src="js/j.js"></script>
<script>
$(document).ready(function(e) {
 $(&#39;#yes&#39;).hide();
 $(&#39;#no&#39;).hide();
  $(&#39;input[name=gcode]&#39;).keyup(function(){
   if($(this).val().length==4){
  $.post(&#39;gbook.php&#39;,{cc:$(&#39;input[name=gcode]&#39;).val()},function(msg){
   
   if(msg==&#39;yes&#39;){
    $(&#39;#no&#39;).hide();
    $(&#39;#yes&#39;).show();
   }else{
    $(&#39;#yes&#39;).hide();
    $("#no").show();
   }
  });
  }
 });
});
</script>


Introduisez d'abord jquery


.sl-error-verifycode {
 background-image: url("images/icons.png");
 background-position: -26px 0;
 background-repeat: no-repeat;
 display: block;
 font-size: 18px;
 height: 23px;
 line-height: 20px;
 margin-left: 180px;
 margin-top: -25px;
 position: relative;
 text-align: center;
 width: 20px;
 z-index: 2;
}
.sl-correct-verifycode {
 background-image: url("images/icons.png");
 background-position: -50px 0;
 background-repeat: no-repeat;
 display: block;
 font-size: 18px;
 height: 23px;
 line-height: 20px;
 margin-left: 180px;
 margin-top: -25px;
 position: relative;
 text-align: center;
 width: 20px;
 z-index: 2;
}


Code HTML du code de vérification


<tr>
  <td height="40" align="right">验证码:</td>
  <td height="40"><span class="addred">*</span></td>
  <td height="40">
  <input type="text" name="gcode" id="textfield7" class="txtlist">
<span id="yes" class="sl-correct-verifycode"></span><span id="no" class="sl-error-verifycode"></span>
  <img style="float:right; margin-top:-25px; margin-right:300px;" align="middle" src="inc/cc.php" onClick="this.src=&#39;inc/cc.php?&#39;+new Date" title="点击换一张图片" width="100px"></td>
 </tr>


gbook.php


<?php
session_start();
if(isset($_POST[&#39;cc&#39;])){
 $cc = strtolower($_POST[&#39;cc&#39;]);
 $ss = strtolower($_SESSION[&#39;code&#39;]);
 if($cc==$ss){
   echo "yes";
 }else{
   echo "no"; 
 }
}


Notez que les photos doivent être importé

Ce qui précède est l'affichage jQuery Ajax des numéros corrects et erronés introduits par l'éditeur pour vérifier si le code de vérification d'entrée est correct. J'espère que cela sera utile à tout le monde ! !

Recommandations associées :

Exemple d'explication détaillée pour obtenir rapidement des objets de communication Ajax

Partage d'exemples de démonstration de flux de cascade Ajax natif

Explication du développement mobile H5 Ajax téléchargeant plusieurs images au format Base64 sur le serveur

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn