怎样使用jquery刷新验证码图片

html 表单jquery validate ,图片验证码刷新, js短信验证码发送 倒计时 html <div class="box"> <div class="item"> <div>商户名称 :花生米有限公司</div> </div> <form action="save" method="post" id="commentForm"> <div class="item"> <div class="title">开户行名 阅读详情

之所以普通的做法无法实现实时更新,是因为被浏览器缓存了,所以加了个时间戳

参考:http://blog.youkuaiyun.com/fengyu09/article/details/50393856

How to refresh the src of <img /> with jQuery?

<img src="test.php" />

where test.PHP generates an image with a random number.

Itried :

$('#verifyimage').click(function() {
        $(this).attr('src',$(this).attr('src'));
    });

But it doesn't work.

Add a timestamp or a random number:

var timestamp = new Date().getTime();
$(this).attr('src',$(this).attr('src') + '?' +timestamp );

怎样使用jQuery刷新验证码图片?

(使用ajax读取django返回的 image/gif,不可行。)


在点击图片时,在其Src属性上增加一个随机数,使用时间戳即可。


附代码:

[java]  view plain  copy
  1. /** 
  2.  * 验证码,提交前验证 
  3.  */  
  4. $(document).ready(function(){  
  5.     var validated = false;  
  6.     $.ajaxSetup({  
  7.       dataType: "json",  
  8.       beforeSend: function(xhr){  
  9.           var csrftoken = $.cookie('csrftoken');  
  10.           xhr.setRequestHeader("X-CSRFToken", csrftoken);  
  11.       }  
  12.     });  
  13.     // 验证码输入失去焦点  
  14.     $("#id_code").blur(function() {  
  15.         //alert(1);  
  16.         $.post(  
  17.             $("#id_url_check").val(),  
  18.             {"code": $("#id_code").val()},  
  19.             function (data) {  
  20.                 if (data.status == true)  
  21.                     validated = true;  
  22.             }  
  23.         );  
  24.     });  
  25.   
  26.     // 提交表单  
  27.     $("form").submit(function(event){  
  28.         if (validated)  
  29.            return true;  
  30.         else {  
  31.             $( "span" ).text( "验证码不正确。" ).show().fadeOut( 3000 );  
  32.             // 更换验证码  
  33.             var timestamp = new Date().getTime();  
  34.             $("#id_img_captcha").attr("src", $("#id_url_captcha").val() + '?' +timestamp );  
  35.             event.preventDefault();  
  36.             }  
  37.         }  
  38.     );  
  39.   
  40.     // 点击更换验证码  
  41.     $('#id_img_captcha').click(function() {  
  42.         var timestamp = new Date().getTime();  
  43.         $(this).attr("src", $("#id_url_captcha").val() + '?'+ timestamp);  
  44. });  
  45. //  
  46. });  
html+jQuery实现拖动滑块图片拼图验证码插件,移动端适用 电脑和手机移动端都适用的jQuery拖动滑块图片拼图验证码插件, 通过鼠标拖动或触屏滑动填充拼图来进行安全验证,点击刷新可以更换当前待验证的图片。 HTML & css: <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta ht... 阅读详情

相关推荐

实现jQuery动态验证码特效

jQuery是目前最流行的JavaScript库之一,它简化了HTML文档遍历、事件处理、动画和Ajax交互,极大地简化了Web开发中复杂的JavaScript编程。通过使用jQuery,开发者可以编写跨浏览器的代码,并且能够在多样的浏览器环境中保持一致性。它不仅易学易用,而且具有丰富的插件支持,可以让开发者轻松实现各种功能。jQuery选择器用于选取页面上的元素,它类似于CSS选择器,但功能更强大。jQuery选择器可以快速定位DOM元素,并允许对这些元素进行操作。

weixin_32099703的博客 420

点击验证码时候自动刷新功能

原理 :本质上是通过点击事件获取到验证码图片的URL地址,实现自动刷新 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录</title> </head> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script&g..

半路出家的码农小王 4356

DBC到ARXML:AUTOSAR CAN通信栈自动化配置完整指南

在AUTOSAR架构下,DBC(CAN数据库文件)与ARXML(AUTOSAR XML)分别扮演着描述总线通信和ECU内部配置的关键角色。DBC定义了网络上的报文与信号,而ARXML则是AUTOSAR工具链交换配置数据的标准格式。在实际的ECU开发中,如何将DBC中的通信信息高效、准确地转换为ARXML,并自动生成可编译的CAN通信栈BSW配置,是许多工程师面临的痛点。借助DaVinci Configurator等工具,我们可以通过自动化导入链路消除手工映射带来的字节序错误、信号起始位偏差等高风险问题,大幅

weixin_34183910的博客 539

JQuery的异步获取带验证码图片登录

下列为服务器端的servlet代码。功能是,向客户端返回一张带验证码的图片,用于登录 import java.awt.Color; import java.awt.Font; import java.awt.Graphics2D; import java.awt.image.BufferedImage; import java.io.IOException; import java.util.Ar...

qq_38850266的博客 1507

三维点云孔洞修复(附Python代码和公共点云数据集链接)

(1)物体自身缺失(2)物体自身形状复杂,很多凹凸面不够规则甚至存在空腔,空腔内部无法被三维激光扫描仪扫描到(3)物体部分区域对激光扫描不敏感,未被扫描上(4)扫描仪的扫描稳定性。

yanghl1215的博客 6953

航空大数据——项目资源汇总及开源(四)

ADS-B项目开源大礼包

cyc头发还挺多的博客 4986

JavaWeb Jquery Ajax实现验证码局部刷新和校验

一:设置JSP页面 (1):给form表单中的 “登录” 按钮设置onsubmit验证点击后调用checkCode()返回结果为true页面跳转,为false页面不跳转。 (2):通过标签设置当点击“看不清?”时调用flushImage();进 行验局部证码刷新。 (3):点击注册按钮转发到"register.jsp"页面。 <body> <form action="login....

weixin_44763323的博客 1198

[信号与系统]一阶与二阶连续时间系统和离散时间系统

定义:一阶连续时间系统由一阶线性常系数微分方程描述: dy(t)dt+ay(t)=bx(t) \frac{dy(t)}{dt} + a y(t) = b x(t) dtdy(t)​+ay(t)=bx(t)时间常数:时间常数 τ=1a\tau = \frac{1}{a}τ=a1​ 是系统响应速度的衡量指标。时间常数越小,系统响应越快。冲激响应:一阶系统的冲激响应是指数衰减或增长的形式。例如,对于一个单位冲激输入,响应为: h(t)=bae−at h(t) = \frac{b}{a} e^{-at} h(t)=

Andius的博客 2122

前端实现图形验证码生成

前端生成图形验证码 !(function(window, document) { var size = 5;//设置验证码长度 function GVerify(options) { //创建一个图形验证码对象,接收options对象为参数 this.options = { //默认options参数值 id: "", //容器Id canvasId: "verifyCanvas", //canvas的ID

handesomeWriter的博客 681

新手必看:如何用Python模拟电动助力转向系统(EPS)的传感器信号处理

本文详细介绍了如何使用Python模拟电动助力转向系统(EPS)的传感器信号处理流程,包括转向力矩、转向角度和车速信号的生成与滤波处理。通过实战代码示例,帮助开发者理解ECU如何计算助力扭矩,并提供了可视化分析和性能优化建议,适合汽车电子系统开发新手学习。

weixin_28327051的博客 355

告别玄学调试:用STM32CubeMX和逻辑分析仪搞定DP83848的RMII与SMI接口

本文详细介绍了如何使用STM32CubeMX和逻辑分析仪调试DP83848的RMII与SMI接口,帮助开发者超越表象,直接观察底层通信波形。通过实战案例和高级调试技巧,解决常见问题如时钟偏移、信号完整性等,提升网络接口的稳定性和可靠性。

weixin_30752699的博客 299

jQuery 验证码输入错误后自动刷新验证码 点击验证码图片刷新验证码

利用jQuery的attr()函数,向Servlet发出请求的时候加一个随机数, 保证每次都是不同的请求 $('#imgVcode').attr("src","/verify_code"+"?" + Math.random());

darling_user的博客 2625

Unity 数字孪生实战:PiXYZ Plugin工业模型高效处理指南

本文是Unity数字孪生实战指南,重点介绍了如何使用PiXYZ Plugin高效处理工业CAD模型。针对工业模型导入Unity时面临的格式壁垒、数据爆炸和资产混乱等核心痛点,文章提供了从环境安装、基础导入到智能减面、资产清理的完整解决方案,并分享了预设自动化、运行时导入等高级技巧与性能优化策略,帮助开发者快速打通工业设计与实时交互流程。

weixin_29009501的博客 257

Java web实现单击验证码 刷新图片 (Jquery )

首先 通过绑定 id 获取 img 对象 然后添加单击事件 $("#img_check").click(function () { this.src="${basePath}kaptcha.jpg" }) this 这里便是指的是 当前对象 需要注意的是 src 可读可写 可以读出来 src的值 同样 可以 赋予url地址 需要替换成你自己验证码地址 不会配置验证码? 传送门:配置验证码 这样写 看似没有问题 当换了浏览器 就可能发现 只

weixin_46999174的博客 1345

干货满满!AI应用架构师分享AI驱动虚拟展示干货

虚拟展示(Virtual Presentation):用数字技术将物理对象/场景转化为可交互的虚拟内容(比如3D文物、虚拟试衣间);AI驱动(AI-Powered):通过AI技术实现实时交互、智能决策、个性化生成,让虚拟内容“活”起来;AI驱动虚拟展示:以用户体验为核心,将“3D渲染+AI理解+实时数据”融合,形成“感知-决策-反馈”的闭环系统。前端交互层是用户直接体验到的部分,再厉害的AI和渲染,只要前端交互烂,用户都会跑。我见过很多团队为了“炫技”做了复杂的AI功能,结果用户不会用。

AI大模型应用之禅 536

Probability and Statistics - 4th edition

Probability and Statistics - 4th edition

java jsp 图片刷新_jsp servlet jquery 实现图片验证码的异步刷新

login.jsp代码htmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">oa自动化办公系统$(function(){$("#verifyimg").click(function(){$.get("/soa/identCodeServlet.do",fun...

weixin_29769523的博客 246

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

验证码无刷新更换

上次说道thinkphp显示验证码,这次来说说验证码的更换 更换验证码,必须是点击文字或点击图片本身,由于是无刷新,所以这里用jquery的异步请求无刷新验证 在html中标记验证码的图片ID: 需要先应用jquery文档: var publicPath = "__PUBLIC__"; var appPath = "__MODULE__";

TonyCreativeStudio 685

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

jsp简单登陆界面加图形验证码,新手必备(二)验证码刷新

如何实现登陆界面验证码的刷新功能? 在通过Maven配置好web服务后,在webapp文件夹中我们建立一个login.jsp文件 <head>标签用于定义文档的头部,它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。 <body>元素定义文档的主体,包含文档的所有内容(比如文本、超链接、图像、表...

weixin_41852068的博客 2581

ajax图片验证码刷新

今天在做ajax图片验证码刷新时,出现了刷新不了的问题 $(document).ready(function(){ $("#img_code").click(function () { console.log(this); console.log($("#img_code")) $.ajax({ url:"{% url 'img_code' %}", type: 'GET' }); this.

DBasdas的博客 314

Jquery实现无刷新验证码

  Jquery实现无刷新验证码 收藏 1.思路:页面上的验证码图片是servlet,采用jquery实现异步校验信息 2.所用到的文件VerifyCodeServlet.java   --用于生成图片的servletResultServlet.java          --用于校验验证码正确性的servletverifyCode.js                  --校验

aa00aa00的专栏 4068

刷新验证码

function refreshimgcode(){ $("#verrifycode-img").attr("src","validateimg?"+Math.random()); }

如果我是超人 335

TP5 验证码点击刷新

TP5 验证码点击刷新

Stussy_Cn 1556

刷新jcaptcha验证码

Grails有个jcaptcha的插件,可以很方便的生成验证码,但是并不提供刷新验证码的功能,如果想这么做,必须要自己动手写js来实现。 首先在页面里定义一个验证码图片对象 [code="html"][/code] 上面这个标签实际生成的html是类似这样的 [code="html"] [/code] 只要变换最后的id,就可以生成新的验证码...

swordinhand的专栏 262

验证码异步刷新

验证码异步刷新 这个是jquery 片段 记得引入 jquery.min.js 这个是Html片段 给img 一个ID

Han_Da_Da的博客 443

.net无刷新验证码

  新建一个CheckCode.aspx页面,保留第一行“<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="identifyingcode.aspx.cs" Inherits="GiftCards.identifyingcode" %>”,其余删掉。   C#验证码图片制作代码: C#代码 1 using S...

weixin_30668887的博客 116
上一篇: Hibernate Criteria多表查询
下一篇: JAVA设计模式之策略模式
SnakeMoving
博客等级 码龄11年 65粉丝 97原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值