jQuery Ajax-重新加載Image onClick可與Chrome一起使用，但不適用於Firefox和IE

Question

好了，這是很怪異....我想重裝這是在服務器端生成的CAPTCHA圖像，我不想要重新加載整個頁面對於這一點，因此我必須使用AJAX。 因此，我要做的是首先在服務器端（使用AJAX）觸發一個php文件，該文件會更新所有需要的內容，這樣我就可以擁有一個新的CAPTCHA映像。 然后，完成此操作后，我只需更新映像src =“”，以從該php文件加載新映像。 這里的代碼：

---

• 文件1

HTML：

<tr id="rowWithCaptcha">
                    <td><p><img id="captchaImg" src="./?<?php echo session_name() ?>=<?php echo session_id() ?>"/></p></td>
</tr>

JQuery-Skript：

$("#reloadImg").click(function(){
           $.ajax({
              url: 'getNewKCAPTCHA.php',
              cache: false,
              type: 'POST',  
              async: false,
              success: function(){
                 $("#captchaImg").attr("src","http://localhost/Captcha2/TestPages/TestPage3Q/getNewKCAPTCHA.php?");
              }
           });
        });

---

• 文件二：

PHP：kcaptcha.php是所有驗證碼魔術發生的地方:)因此，如果您僅在瀏覽器中打開此php文件，您將獲得驗證碼圖像本身。 如果重新加載頁面，圖像每次都會更改。

    <?php include('kcaptcha.php'); session_start(); $captcha = new KCAPTCHA(); $_SESSION['captcha_keystring'] = $captcha-getKeyString(); echo TRUE; ?>

---

因此，現在很奇怪的是，整個事情（AJAX調用和圖片更新）在新的chrome瀏覽器上都可以正常工作，但是當我在FFOX或IE上嘗試時，它只能工作一次，任何進一步的單擊都不會改變任何東西。 ....我認為它與JQuery部分有關，但我無法使其工作：///

每個幫助表示贊賞！！！ 提前感謝！

Answer 1

這可能與HTML5支持有關。 我不久前遇到了同樣的問題，而且似乎FF和IE都不支持

$('whatever').click(function(){});

但是，如果您在html標簽中使用onclick =“ function（）”進行調用，它可能會起作用，但是我不知道它是否起作用

Answer 2

我不是編輯src屬性的忠實擁護者。 我通常會刪除圖像（或替換為加載圖像），然后附加新圖像（並刪除加載圖像）。 下面的代碼應刪除該圖像並附加一個新圖像-我錯過了所有正在緩沖的圖像替換物品

 $("#reloadImg").click(function(){
               $.ajax({
                  url: 'getNewKCAPTCHA.php',
                  cache: false,
                  type: 'POST',  
                  async: false,
                  success: function(){
                     $("#captchaImg").remove();
                     $("#rowWithCaptcha td p").append('<img id="captchaImg" src="http://localhost/Captcha2/TestPages/TestPage3Q/getNewKCAPTCHA.php?" />');

                  }
               });
            });

希望能幫助到你

Answer 3

假如說

url: 'getNewKCAPTCHA.php',

和

http://localhost/Captcha2/TestPages/TestPage3Q/getNewKCAPTCHA.php?

實際上是相同的腳本，因此無需調用兩次。

考慮以下簡單方法（我在實際項目中使用的工作方法）：

$("#reloadImg").click(function(){
    var d = new Date ();
    var captcha = "http://localhost/Captcha2/TestPages/TestPage3Q/getNewKCAPTCHA.php?r=" + d.getTime ();
    $("#captchaImg").attr ("src", captcha);
});

http://jsfiddle.net/hGfgn/

問候