javascript验证码刷新 js点击验证码刷新

重点代码：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>
<script type="text/javascript">