2013-03-02 55 views
0

我想创建一个登录页面。 所以我把一个验证码图片中的登录表单与下面的HTML代码:使用AJAX更改图像

<img name="captcha" id="captcha" src="captcha/CaptchaSecurityImages.php?width=90&height=28&characters=5"/> 

,我把一个按钮,用户可以点击更改验证码,如果它是不可读如下:

<input type="button" name="new_Captcha_button" onClick="new_captcha()"/> 

我写了一个脚本遵循的工作只是在镀铬:

<script type="text/javascript"> 
function new_captcha() 
    { 
     document.images["captcha"].src = "captcha/CaptchaSecurityImages.php?width=90&height=28&characters=5"; 
    } 
</script> 

,但它并没有在其他浏览器工作,所以我用以下内容替换以前的代码:

<script type="text/javascript"> 
function new_captcha() 
    { 
     var xmlhttp; 
     if (window.XMLHttpRequest) 
      {// code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
      } 
     else 
      {// code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
     xmlhttp.onreadystatechange=function() 
      { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       document.getElementById("captcha").src = xmlhttp.responseText; 
       } 
      } 
     xmlhttp.open("GET","captcha/CaptchaSecurityImages.php?width=90&height=28&characters=5",true); 
     xmlhttp.send(); 
    } 

所以,请告诉我什么样的变化,我需要在我的代码做,使之正确。我想我需要改变一下行:

document.getElementById("captcha").src = xmlhttp.responseText; 

非常感谢。

回答

1
<script type="text/javascript"> 
function new_captcha() 
    { 
     document.getElementById('captcha').src = 'captcha/CaptchaSecurityImages.php?width=90&height=28&characters=5&_t=' + Math.random(1); 
    } 
</script> 

不需要使用ajax,函数new_captcha()就可以。

+0

欢迎来到Stackoverflow ..!请详细说明你的问题。 – 2013-03-02 09:24:59

1

你可以尝试这样做

的login.php

<div id="captcha_container"></div> 
<input type="button" id="btn_recaptcha" value="Recaptcha"> 

<script> 
function ajax_loadpage(loadUrl,output_container) 
    { 
     $.post 
     (
      loadUrl, 
      {language: "php", version: 5},function(responseText){$(output_container).html(responseText);},"html" 
     ); 
    } 

ajax_loadpage("captcha_page.php","#captcha_container"); 

$('#btn_recaptcha').click(function(){ 
    ajax_loadpage("captcha_page.php","#captcha_container"); 
}) 
</script> 
______________________________________________________________________________________ 
captcha_page.php 
<img width="212" height="53" src="captcha.php"> 

captcha.php包含我的图形验证码,它包含了一个header ("Content-type: image/gif");代码,所以我需要在那里我可以节省额外的PHP文件图像文件,从而使用我的captcha_page.php。 为我工作:)