如何隱藏Jquery中已經用.load function加載的元素

Question

我有一些類，我用 JQuery 加載 Function 更新。當頁面首次加載時，我將它們作為目標並隱藏它們，如下所示：

$('.classname').hide();

我像這樣load ajax：

$.ajax({  
  type: "GET",  
  url: "index.php",  
  data: dataString,  
  success: function() {  
      $('.wrapperClass').load('index.php .wrapperClass');
      $('.classname').hide();
  },
      error: function() {

      }  
});

為了簡單起見，html 是這樣的：

<div class="wrapperClass">
    <span class="classname">Content 1</span>
    <span class="classname">Content 2</span>
</div>

問題是， wrapperClass內部的所有內容都可以重新加載，但內部的 span 不會被隱藏，它們會重新出現，而且在通過 Ajax 重新加載它們后我不知道如何隱藏它們。

Answer 1

正如您可能（\應該）知道的那樣， load是一個 ajax 請求，因此當您試圖隱藏它們時不會加載這些元素。

將處理加載內容的代碼移到 complete 回調中：

success: function() {  
      $('.wrapperClass').load('index.php .wrapperClass', function(){
              $('.classname').hide();              
          });
      }

完整代碼：

$.ajax({
    type: "GET",
    url: "index.php",
    data: dataString,
    success: function() {
        $('.wrapperClass').load('index.php .wrapperClass', function() {
            $('.classname').hide();
        });
    },
    error: function() {

    }
});​

load文檔：

.load( url [, data] [, complete(responseText, textStatus, XMLHttpRequest)])

• url包含請求發送到的 URL 的字符串。
• data map 或隨請求一起發送到服務器的字符串。
• complete(responseText, textStatus, XMLHttpRequest)請求完成時執行的回調 function。

Answer 2

你需要堅持$('.classname').hide(); 進入 .load .load()的回調 function。 現在，它試圖在元素出現在頁面之前隱藏它們。 試試這個：

$.ajax({  
  type: "GET",  
  url: "index.php",  
  data: dataString,  
  success: function() {  
      $('.wrapperClass').load('index.php .wrapperClass', function() {$('.classname').hide();});
  },
      error: function() {

      }  
});