码迷,mamicode.com
首页 > Web开发 > 详细

jquery ajax显示对号和错号,用于验证输入验证码是否正确

时间:2015-06-22 22:17:29      阅读:248      评论:0      收藏:0      [点我收藏+]

标签:

  1. <script src="js/j.js"></script>
  2. <script>
  3. $(document).ready(function(e) {
  4. $(‘#yes‘).hide();
  5. $(‘#no‘).hide();
  6. $(‘input[name=gcode]‘).keyup(function(){
  7. if($(this).val().length==4){
  8. $.post(‘gbook.php‘,{cc:$(‘input[name=gcode]‘).val()},function(msg){
  9. if(msg==‘yes‘){
  10. $(‘#no‘).hide();
  11. $(‘#yes‘).show();
  12. }else{
  13. $(‘#yes‘).hide();
  14. $("#no").show();
  15. }
  16. });
  17. }
  18. });
  19. });
  20. </script>
首先引入jquery
  1. .sl-error-verifycode {
  2. background-image: url("images/icons.png");
  3. background-position: -26px 0;
  4. background-repeat: no-repeat;
  5. display: block;
  6. font-size: 18px;
  7. height: 23px;
  8. line-height: 20px;
  9. margin-left: 180px;
  10. margin-top: -25px;
  11. position: relative;
  12. text-align: center;
  13. width: 20px;
  14. z-index: 2;
  15. }
  16. .sl-correct-verifycode {
  17. background-image: url("images/icons.png");
  18. background-position: -50px 0;
  19. background-repeat: no-repeat;
  20. display: block;
  21. font-size: 18px;
  22. height: 23px;
  23. line-height: 20px;
  24. margin-left: 180px;
  25. margin-top: -25px;
  26. position: relative;
  27. text-align: center;
  28. width: 20px;
  29. z-index: 2;
  30. }
验证码的html 代码
  1. <tr>
  2. <td height="40" align="right">验证码:</td>
  3. <td height="40"><span class="addred">*</span></td>
  4. <td height="40">
  5. <input type="text" name="gcode" id="textfield7" class="txtlist">
  6. <span id="yes" class="sl-correct-verifycode"></span><span id="no" class="sl-error-verifycode"></span>
  7. <img style="float:right; margin-top:-25px; margin-right:300px;" align="middle" src="inc/cc.php" onClick="this.src=‘inc/cc.php?‘+new Date" title="点击换一张图片" width="100px"></td>
  8. </tr>
gbook.php
  1. <?php
  2. session_start();
  3. if(isset($_POST[‘cc‘])){
  4. $cc = strtolower($_POST[‘cc‘]);
  5. $ss = strtolower($_SESSION[‘code‘]);
  6. if($cc==$ss){
  7. echo "yes";
  8. }else{
  9. echo "no";
  10. }
  11. }
注意图片一定要引入
技术分享
技术分享








jquery ajax显示对号和错号,用于验证输入验证码是否正确

标签:

原文地址:http://www.cnblogs.com/lsr111/p/4593982.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!