我正在构建一个联系表单,它通过 jQuery 使用 ajax 来获取 CAPTCHA 图像(和隐藏的数据字段),并在 DOM 准备好后将其放入表单中。此外,当单击验证码图像时,它会重新加载图像(以及隐藏的数据字段)。
CAPTCHA 图像创建脚本是我自己创建的,我已经使用了几年 - 它非常强大并且工作正常,但是这是我第一次尝试通过 ajax 将它集成到网站。
粗略地说,我有以下 jQuery。我认为支持的 HTML/CSS/PHP 无关紧要 - 如果需要,我可以提供一些,但一切似乎都很好......问题似乎与 jQuery 或 Chrome 浏览器缓存有关......
$(document).ready(function() {
commentFormCaptchaWrapper = $('#captchawrapper');
// Check DOM for CAPTCHA wrapper... if it's there get the CAPTCHA image
if (commentFormCaptchaWrapper.length > 0) {getCaptchaImage()}
// If the CAPTCHA image is clicked get a new one
commentFormCaptchaWrapper.click(getCaptchaImage);
});
function getCaptchaImage(){
commentFormCaptchaWrapper.html();
$.ajax({
url: '/captcha/ajax.captcha.php',
type: 'post',
cache: false,
success: function(response){
commentFormCaptchaWrapper.html(response);
},
error: function(response){
alert ("Ajax Error");
}
});
}
在 Firefox(实际上还有 Opera 和 IE)中,一切都按照我希望的方式运行,但在 Chrome 中却不行。在 Chrome 中,对 CAPTCHA 图像和隐藏字段的初始 ajax 调用工作得很好,但是当您单击 CAPTCHA 时,会出现短暂的闪烁,因为 Captchawrapper div 已清空(因此检测到单击正常),但它会重新加载相同的图像。
为了简要解释我的验证码脚本,通常它会根据一些文本生成图像并加密内容以用作文件名(带有时间戳后缀) - 然后使用唯一名称缓存图像。因此,CAPTCHA 脚本每次使用时都会提供一个完全唯一的不同文件名。
我还没有完全跟上 jQuery 的速度,但是据我所知,我已经关闭了 jQuery 中的 ajax 缓存,所以我不知道出了什么问题……有人能帮忙吗?