在Ajax电话上刷新验证码

Question

我有以下代码，我用这些代码通过JavaScript刷新码头图像。无论如何，我还可以使用AJAX请求实现这一目标吗？

<script>
function refreshCaptcha() {
    $("#captcha_code").attr('src','captcha_code.php');
}
</script>
<button name="submit" onClick="refreshCaptcha();">Refresh Captcha</button>

Answer 1

是的，但是您需要手动处理会话！

 <script>
 $(".RefreshCaptcha").click(function () {
     $.post('captcha_code.php', function(data, status){
         $("#captcha_code").attr('src', data);
         console.log("ajax log: " +  status);
     });         
 });
</script>
<button class="RefreshCaptcha">Refresh Captcha</button>

w3shcools ajax.post

Answer 2

您可以使用以下代码。

<script>
    $(document).ready(function() {
        setInterval(function() {
            $.post('captcha_code.php', function(data) {
                $('#captcha_code').html(data);
            });
        }, 1000);
    });
</script>

Answer 3

是的，可以使用Ajax通过JavaScript更新图像。由于代码已经使用了jQuery，因此一种简单的方法是使用$ .post（）将其发布到PHP脚本。假设 captach_code.php 仅返回映像源（例如base-64编码字符串），您可以将 src 属性设置为 westment（例如，在函数 updateImage（）下面）。

function refreshCaptcha() {
    $.post('captcha_code.php', updateImage);
}
function updateImage(response) {
      $("#captcha_code").attr('src',response);
}

在此PHPFIDDLE中看到它。 NOTE - 没有对文件名的控制

$。post（）返回一个JQXHR对象，该对象实现了承诺接口。因此，可以使用.done（）和其他类似功能，而不是指定成功回调：

function refreshCaptcha() {
    $.post('captcha_code.php')
    .done(function(response) {
          $("#captcha_code").attr('src',response);
     })
     .fail(function() {
         //fail handler...
     })
     .always(function() {
         //handler for all cases
     });
}

在此phpfiddle中看到它。