jQuery的.hide（）和.show（）不工作

我有此代碼生成動態使用PHP代碼： -jQuery的.hide（）和.show（）不工作

<div class="mailList" id="M_6"> 
    <div class="mailListHeader" id="H_6"> 
     <img style="float:right; display:none;" class="loaderIMG" id="LOADER_6" src="images/preloader.gif"> 
     Sent by <strong>Admin</strong> on <strong>Oct 03 2013 02:53 PM</strong> to <strong>Received Response</strong> for Quarter <strong>3</strong> Year <strong>2013</strong>.<br> 
     Subject: <strong>Test Mail</strong><br> 
    </div> 

    <div class="mailListContent" id="C_6"> 
     <div class="closeContent" id="CC_6">Close [x]</div> 
     <span id="SPAN_6"></span> 
    </div> 

    <div class="mailListFooter" id="F_6"> 
     <span class="mailContentBtn" id="MCBTN_6" style="font-size:11px; color:#09C; cursor:pointer;"> 
      View Content 
     </span> 
     <span class="mailListBtn" id="MLBTN_6" style="float:right; font-size:11px; color:#C06; cursor:pointer;"> 
      Successfull-[0] Failed-[4] 
     </span> 
    </div> 
</div>

然後，用戶可以點擊視圖內容或Successfull- [0]失敗 - [4]這將使ajax請求比顯示結果在div mailListContent。下面是jQuery的AJAX請求代碼： -

$(".mailContentBtn, .mailListBtn").click(function(){ 
    var currentId = $(this).attr('id'); 
    currentId = currentId.split("_"); 
    var actualId = currentId[1]; 

    if($("#C_"+actualId).is(":visible")) { 
     $("#C_"+actualId).hide("slow","swing"); 
    } 
    $("img#LOADER_"+actualId).show(); 

    if(currentId[0]=="MCBTN") { 
     var dataString ="action=getMailContentByID&mailID="+actualId; 
    } else { 
     var dataString ="action=getMailListByID&mailID="+actualId; 
    } 

    $.ajax({ 
     type: "POST", 
     url: "include/getMail.php", 
     data: dataString, 
     cache: false, 
     async: false, 
     success: function(html) { 
      $("#SPAN_"+actualId).empty(); 
      $("#SPAN_"+actualId).append(html); 

      $("#C_"+actualId).show("slow","swing"); 
      $("img#LOADER_"+actualId).hide(); 
     } 
    }); 
});

的請求和事件工作正常，問題出在查看內容或Successfull- [0]失敗 - [4]每次用戶點擊加載圖像不顯示。正如你所看到的，我給每個加載圖像一個唯一的ID，而不是隻有一個加載圖像顯示在clik上。 Google Chrome中的檢查代碼沒有錯誤。我該如何解決這個問題？

謝謝。

來源

2013-10-24 errorare

在調用$ .ajax時，將「async」選項更改爲「true」。因爲在你的情況下，$ .ajax會在加載圖像同步執行時阻塞UI線程。

來源

2013-10-24 05:20:32 eggward

意外的解決方案。好簡單。我甚至不認爲異步：假造成這個問題。謝謝。 :) – errorare

您已經錯過了：

$(document).ready(function() { 
});

試試這個：

<script> 
     $(document).ready(function() { 
      $(".mailContentBtn, .mailListBtn").click(function() { 
       var currentId = $(this).attr('id'); 
       currentId = currentId.split("_"); 
       var actualId = currentId[1]; 

       if ($("#C_" + actualId).is(":visible")) 
        $("#C_" + actualId).hide("slow", "swing"); 

       $("img#LOADER_" + actualId).show(); 

       if (currentId[0] == "MCBTN") { 
        var dataString = "action=getMailContentByID" + 
          "&mailID=" + actualId; 
       } 
       else { 
        var dataString = "action=getMailListByID" + 
          "&mailID=" + actualId; 
       } 

       $.ajax({ 
        type: "POST", 
        url: "include/getMail.php", 
        data: dataString, 
        cache: false, 
        async: false, 
        success: function (html) { 
         $("#SPAN_" + actualId).empty(); 
         $("#SPAN_" + actualId).append(html); 

         $("#C_" + actualId).show("slow", "swing"); 
         $("img#LOADER_" + actualId).hide(); 
        } 
       }); 
      }); 
     }) 


    </script>

來源

2013-10-24 05:22:42

我已經有$（document）.ready（function（）{ }）;在我的頁面。對不起，遲到迴應。 – errorare

jQuery的.hide（）和.show（）不工作

回答

相關問題