jQuery無法找到相同的div如果我刪除並添加回來？

Question

我試圖將不同的內容加載到div中，我的刷新代碼與此非常相似：http://jsfiddle.net/TbJQ3/6/但更復雜，需要考慮填充和magin等。

區別在於，在我的實際代碼中，我使用了.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容器功能
• 以上所有和更多的組合

我發現後，我裝我的內容，jQuery的是無法找到了得到了重新插入的div ...這可以解釋爲什麼我的resizeContainer功能無法設置寬度和高度正確...但是爲什麼？我可以看到它在屏幕上的div以及在螢火蟲...

這是我看到後，我交換內容，顯然風格不存在，因爲我的自定義resizeContainer函數couldn'找到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

Load是一種Ajax方法，在使用ajax方法時插入來自外部文件的內容，而不是大多數情況下必須使用jQuery的live（）方法的append方法。訪問插入的DOM元素。

第一次使用Ajax插入內容時，嘗試使用detach和其中一個附加方法而不是Ajax重新插入它，否則它將不起作用，因爲加載只是重新插入新的DOM元素，而不是您的內容只是分開。