jCaptcha - 只刷新圖像不是整個頁面

Question

我在我們的網站上使用jCaptcha（http://jcaptcha.sourceforge.net/）。問題有時很難讀取圖像。因此，我們計劃在jcaptcha圖片旁邊提供一個名爲'REFRESH'的按鈕，點擊REFRESH按鈕後，它只需刷新jcaptcha圖片而不是整個頁面/ portlet。我們怎麼做到這一點？

Answer 1

你將不得不加載圖像和刷新按鈕。比你應該能夠刷新iframe。但我不知道你是如何執行你的驗證。

Answer 2

設置ID爲img標籤，讓它調用javascript函數：

<img src="jcaptcha.jpg" id="captchaImage"/> 

javascript函數：

<script type="text/javascript"> 
    function refresh() 
    { 
     var captchaImage=document.getElementById("captchaImage"); 
     captchaImage.src="jcaptcha.jpg";  
    } 
</script> 

Answer 3

這是我如何解決它使用JQuery，它將取代圖像。 alert（）就是在那裏顯示新的文件名，當然可以刪除。該代碼在grails中使用jquery插件，但顯示瞭如何在jquery中刷新圖像。

<div> 
<jcaptcha:jpeg name="captchaImage"/> 

<a href="#" id="refreshCaptcha">Refresh captcha</a> 
<jq:jquery> 
    $("#refreshCaptcha").click(function() { 
     $("#captchaImage").fadeOut(500, function() { 
     var captchaURL = $("#captchaImage").attr("src"); 
     captchaURL = captchaURL.replace(captchaURL.substring(captchaURL.indexOf("=")+1, captchaURL.length), Math.floor(Math.random()*9999999999)); 
     alert(captchaURL); 
     $("#captchaImage").attr("src", captchaURL); 
     }); 
     $("#captchaImage").fadeIn(300); 
}); 
</jq:jquery> 
</div> 

Answer 4

這工作得很好，因爲我實現了我的項目這一個剛剛創建點擊該按鈕一個按鈕，它會在下面的代碼menctiond塊一樣，你做

<script type="text/javascript"> 
function refresh() 
{ 
var image=document.getElementById("kaptchaImage"); 
image.src="<%=request.getContextPath()%>/kaptcha.jpg?"+Math.floor(Math.random()*100)   
} 
</script> 

Answer 5

讓這改變了JSP：

<img src="jcaptcha" id="captcha_image"/> <a href="#" onclick="reloadCaptcha()" alt="reload"width="40" height="40">Refresh</a> 

添加JavaScript函數，如：

function reloadCaptcha(){ 
     var d = new Date(); 
     $("#captcha_image").attr("src", "jcaptcha?"+d.getTime()); 
    }