验证码点击刷新实现方法 - longmsdu

重点代码：onClick="this.src=this.src+\'?\'+Math.random();"

其实就是请求新的验证码，为了请求到新的验证码而不是原来产生的验证码，在URL中加入了Math.random()随机数，this.src是img的属性，通过改变img的属性src就可以更换验证码的图片

如下是我实践的两个方案合一的案例：

HTML代码:

<tr>
   <th>验证码:</th>
   <td>
      <input type="code" class="len250" name="code"/>
                    <img src="{:U(\'Index/verify\',\'\',\'\')}" onClick="this.src=this.src+\'?\'+Math.random();" id="code" title="点击刷新"/>   <!--点击图片刷新-->
                    //img标签下的src就是调用Login控制器中的veryfy方法
  　　　　　　　　　　//后面的两个参数留空是必须的，其中第2个没实际意义，主要是为了第3个参数留空，这样设置可以取消伪静态后缀名，
　　　　　　　　　　　//否则默认的伪静态后缀名为html，将会导致无法正常加载图片
　　　　　　　　　　　<a  href="javascript:void(0);"  onclick="shuaxin()">看不清</a>                                           <!--点击‘看不清’刷新-->
   </td>
</tr>

JS代码:

<script type="text/javascript">
    var verifyURL=$("img#code").attr(\'src\');//动态获取img-URL
    function shuaxin(){
$("img#code").attr(\'src\',verifyURL+\'/\'+Math.random());
    }
</script>

解除伪静态的方案：

HTML代码:

<tr>
   <th>验证码:</th>
   <td>
      <input type="code" class="len250" name="code"/>
                    <img src="{:U(\'Index/verify\',\'\',\'\')}" onClick="this.src=this.src+\'?\'+Math.random();" id="code" title="点击刷新"/>   <!--点击图片刷新-->
                    //img标签下的src就是调用Login控制器中的veryfy方法
  　　　　　　　　　　//后面的两个参数留空是必须的，其中第2个没实际意义，主要是为了第3个参数留空，这样设置可以取消伪静态后缀名，
　　　　　　　　　　　//否则默认的伪静态后缀名为html，将会导致无法正常加载图片
　　　　　　　　　　　<a  href="javascript:void(0);"  id="shuaxin">看不清</a>                                           <!--点击‘看不清’刷新-->
   </td>
</tr>

JS代码:

<script type="text/javascript">

$(function(){
$(\'#shuaxin\').click(function(){
var verifyObject = $(this).siblings(\'img\');
        verifyObject.attr(\'src\',verifyObject.attr(\'src\')+\'?\'+Math.random());
    });
});

</script>