如果我刪除並重新添加它，jQuery無法找到相同的div？

Question

我正在嘗試將不同的內容加載到div中，刷新代碼與此非常相似： http : //jsfiddle.net/TbJQ3/6/，但更為復雜，它考慮了填充和余量等。

區別在於，在我的實際代碼中，我使用.load（）將內容提供給div而不是empty（）和append（）。

第一次加載頁面時，我調用resizeContainer（）函數以動態設置布局以設置DIV的大小，一切看起來都很好。 我看着螢火蟲，這就是我得到的（所有大小都在那，由我的功能設置）：

<div id="divWrapper" class="fullscreen">
  <div id="divTop" class="Top " style="height: 0px;"> </div>
    <div id="divContainer" class="Container round" style="width: 1024px; height: 560px;">
      <div id="divContent" class="Content round" onclick="javascript: jQfn.testclick();" style="width: 701px; height: 542px;"> Content </div>
      <div id="divQuery" class="Query round" onclick="javascript: jQfn.testclick();" style="width: 292.2px; height: 558px;"> Query </div>
      <div id="divStatus" class="Status " onclick="javascript: jQfn.testclick();" style="width: 701px; float: left;"> Status </div>
    </div>
</div>

我做了一個測試功能來基本上交換內容，只是為了測試概念。

jQfn.testclick = function(){
  if (jQ.busy == true) {
     console.log('Using busy.jsp');
     jQ('#divContainer').load('busy.jsp');
     jQ.busy = false;
  } else {
     console.log('Using login.jsp');
     jQ('#divContainer').load('login.jsp');
     jQ.busy = true;
  }
  jQ(window).trigger('resize');
}

但是，如果我單擊兩次只是將其交換回原始內容，我的resizeContainer函數將根本不會呈現任何內容。

我過去5個小時以來一直在解決這個問題，我嘗試使用：

• 空，追加
• 分離
• 以許多不同的方式調用resize函數
• 以許多不同的方式調用我的自定義resizeContainer函數
• 以上所有和更多的組合

我注意到，在加載內容后，jQuery 無法找到重新插入的div ...這可以解釋為什么我的resizeContainer函數無法正確設置寬度和高度...但是為什么？ 我可以在屏幕以及螢火蟲的div上看到它。

這是我交換內容后看到的，顯然是樣式不存在，因為我的自定義resizeContainer函數找不到div。

<div id="divWrapper" class="fullscreen">
  <div id="divTop" class="Top " style="height: 0px;"> </div>
  <div id="divContainer" class="Container round" style="width: 1024px; height: 560px;">
    <div id="divContent" class="Content round" onclick="javascript: jQfn.testclick();"> Content </div>
    <div id="divQuery" class="Query round" onclick="javascript: jQfn.testclick();"> Query </div>
    <div id="divStatus" class="Status " onclick="javascript: jQfn.testclick();" style="width: 701px; float: left;"> Status </div>
  </div>
</div>

我知道jQuery找不到div的原因是因為我使用了以下代碼，並且它記錄了一些空元素：

var content = jQuery('#divContent');
console.log(content);

有什么事嗎 我什至嘗試在加載新內容之前手動分離這些DIV。

Answer 1

加載是一種Ajax方法，它在使用ajax方法而不是append方法時從外部文件插入內容，在大多數情況下，您將不得不使用jQuery的live（）;。 獲得對插入的DOM元素的訪問權限。

一旦使用Ajax首次插入了內容，請嘗試使用detach和一個append方法（而不是Ajax）來重新插入它，否則它將無法正常工作，因為加載只是重新插入新的DOM元素，而不是剛剛分離的內容。