jQuery实现点击切换验证码

验证码在我们浏览器显示其实就是一张图片

1）为img标签绑定onclick事件

<img id="changeCheckCode" src="${pageContext.request.contextPath }/CheckImg" onclick="changeCheckCode()"/>

2）书写事件内容，重新发送请求更换验证码，在最后拼接一个时间戳或者拼接随机数

拼接时间戳

function changeCheckCode(){
		$("#changeCheckCode").attr("src","${pageContext.request.contextPath }/CheckImg?time="+new Date().getTime());
	}

拼接随机数

function changeCheckCode(){
		$("#changeCheckCode").attr("src","${pageContext.request.contextPath }/CheckImg?random="+Math.random());
	}

为什么需要在最后拼接上参数呢？

第一次访问获得验证码后，浏览器会将其加入缓存，如果不拼接随机数或者时间戳，浏览器会认为是同一个请求，直接从缓冲中拿验证码。加上参数是为了骗过浏览器，让其认为是不同的请求，从而获取新的验证码。