js 实现 点击图片刷新 验证码 看不清 换一张
生活随笔
收集整理的這篇文章主要介紹了
js 实现 点击图片刷新 验证码 看不清 换一张
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
第一種：js和html語句分離
注意：checkcode.java代碼在上一篇驗證碼文章中
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>切換二維碼</title> <script type="text/javascript"> window.onload=function(){//獲取img標(biāo)簽的對象img=document.getElementById("exchangecode");img.onclick=function(){//加時間戳,避免瀏覽器緩存var date=new Date().getTime()img.src="/responseproject/checkcode?"+date;}//獲取a標(biāo)簽的對象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>第二種：第一種的省略版（不跳轉(zhuǎn)頁面）
<!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上改進，其實是跳轉(zhuǎn)頁面
<!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>總結(jié)
以上是生活随笔為你收集整理的js 实现 点击图片刷新 验证码 看不清 换一张的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 简单验证码的原理
- 下一篇： JS常用的表单验证（数字、长度,汉字，邮