zoukankan      html  css  js  c++  java
  • 关于网页中不刷新页面改变验证码的两种方法

           今天做一个注册的页面,需要输入验证码。验证码的生成是动态的,不过要刷新页面,才能改变验证码,因为刷新后浏览器会向服务器提交新的请求,服务器就动态生成新的验证码响应给浏览器。为了能够在不刷新页面的情况下改变验证码,需要JavaScript的支持。

      第一种方法是在请求地址后面带参数,这是一个小窍门。因为浏览器访问服务器的时候地址后面可以带上参数一起传给服务器,而加载内容是只看地址不看后面的参数;另外在<img src="地址"/>中,只要浏览器发现地址改变了就会自动重新加载该地址指向的图片。所以只要给地址后面带上当前时间的参数那么地址就一直都是不一样的,从而让浏览器认为地址发生改变重新去加载验证码图片。具体做法是:<img src="地址" onclick="this.src=this.src+'?'+(new Date()).getTime()" /> 这样就可以在鼠标点击图片的时候自动改变src地址后的参数,从而实现自动加载。

      第二种方法是写一个JavaScript方法,在点击链接就调用改方法改变地址从而实现自动改变。具体方法是:
    <script type="text/javascript">
    function changeVerifyCode(){
    var img = document.getElementByIdx('imgVcode'); //在拿到id=imgVcode的<img/>对象
    var time = new Date().getTime();//拿到当前时间
    img.src = img.src +'?' + time;//拼接img中src的地址,目的和第一种方法一样
    }
    </script>   

    调用的地方是<img id="imgVcode" src="地址" />之后的任何地方 。
    <a href="javascript:verifyCode()">看不清楚?换个图片</a> 点击就可以改变验证码了^_^

    这是从网上截取下来的,仅用于个人收藏。

  • 相关阅读:
    Python基础知识(day3)
    前端开发工具Brackets介绍,安装及安装Emme插件时踩过的坑
    AngularJs学习笔记2-控制器、数据绑定、作用域
    AngularJs学习笔记1——总体介绍
    AngularJs学习笔记0——前言
    Oracle常用几种Sql用法
    个人2015年工作计划
    C#语法糖之第六篇: 泛型委托- Predicate<T>、Func<T>
    C#语法糖之第五篇: 泛型委托- Action<T>
    C#语法糖之第三篇: 匿名类 & 匿名方法
  • 原文地址:https://www.cnblogs.com/xiongxuesong/p/4681520.html
Copyright © 2011-2022 走看看