失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > js 实现 点击图片刷新 验证码 看不清 换一张

js 实现 点击图片刷新 验证码 看不清 换一张

时间:2023-07-21 23:28:22

相关推荐

js 实现 点击图片刷新 验证码 看不清 换一张

第一种:js和html语句分离

注意:checkcode.java代码在上一篇验证码文章中

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>切换二维码</title><script type="text/javascript">window.onload=function(){//获取img标签的对象img=document.getElementById("exchangecode");img.onclick=function(){//加时间戳,避免浏览器缓存var date=new Date().getTime()img.src="/responseproject/checkcode?"+date;}//获取a标签的对象ec=document.getElementById("ecode");ec.onclick=function(){//加时间戳var date=new Date().getTime()img.src="/responseproject/checkcode?"+date;}}</script></head><body><img id="exchangecode" src="/responseproject/checkcode"> <a id="ecode" href="#">看不清?换一张图片</a></body></html>

第二种:第一种的省略版(不跳转页面)

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>切换二维码</title><script type="text/javascript">function jump() {imge=document.getElementById("exchangecode");var time=new Date().getTime();imge.src="/responseproject/checkcode?"+time;}</script></head><body><img id="exchangecode" src="/responseproject/checkcode" onclick="jump();"> <a id="ecode" href="#" onclick="jump();">看不清?换一张图片</a></body></html>

第三种:在href上改进,其实是跳转页面

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>切换二维码</title><script type="text/javascript">function jump() {imge=document.getElementById("exchangecode");var time=new Date().getTime();imge.src="/responseproject/checkcode?"+time;}</script></head><body><img id="exchangecode" src="/responseproject/checkcode" onclick="jump();"> <a id="ecode" href="javascript:jump();" >看不清?换一张图片</a> </body></html>

如果觉得《js 实现 点击图片刷新 验证码 看不清 换一张》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。