Problem with refresh image captcha using jquery

hello,

i have strange problem ! ,

i made code to generate captcha image , and it’s work very fine , but i made a button in page to refresh the captcha image using ajax by jquery ,

this the the js function :


function refreshcapt(a){
	$("span#captchaimg").html('');
	$("span#captchaimg").load("index.php?act=captcha&id="+a+"");
}

and in the php code in page (index.php?act=captcha&id=) is :


echo "<img src=\\"index.php?act=captchaimg&id=$id\\" alt=\\"\\" />";

and in the php code in page (index.php?act=captchaimg&id=) which generate the captcha code is class :


$id=(int)$id;
				
$imgsrc=listdirins($this->captchadir,1,1);
$imgsrc=$this->captchadir.'/'.array_rand($imgsrc,1);
$alphanum = '123456789abcdefghijkmnpqrstuvwxyz';

$rand = substr(str_shuffle($alphanum),0,3);
$_SESSION['imageverf_'.$id]=base64_encode($rand);
$image= imagecreatefromjpeg($imgsrc);
$text_color= imagecolorallocate($image,255,255,255);
imagestring($image,5,5,4,$rand,$text_color);
$image2=imagecreatetruecolor($width,$height);
$dims=getimagesize($imgsrc);
				
imagecopymerge($image2, $image, 0, 0, 0, 0,  $dims[0], $dims[1], 100);
header('content-type: image/png');
imagepng($image2);
imagedestroy($image2);

the problem is when i refresh the captcha image using the jsuqery function , its refresh but the captcha image don’t change always , it may need to click on the refresh button more than 2 time , for changing the captcha image ,
although when i go to the php page directly which generate the captcha image by IE8 Browser and try refresh , it work good , so i think the oblem in the method of refrsh the captcha image by jquery ,
so plz help me and give me the solution to when i click on the refresh button it refresh captcha image directly , instead of need to click on button two or 3 or 4 times to refresh the image !! …

Thank u,

Hi, it might be because web browser caches the previous image. Try changing your code to:


function refreshcapt(a){
     var t = new Date();
     $("span#captchaimg").html('');
     $("span#captchaimg").load("index.php?act=captcha&id="+a+"&t="+t.getTime());
}

this way you will have current time (in seconds) appended to each request, and browser will never cache it.

Hello Alan

I changed the js code , and i tried from many browsers but it’s the same problem :frowning:

hello Alan,

thanks alot , i did it using ur method , it’s work fine now !