jQuery的：預引用元素處理爲動態添加元素

Question

我被宣佈所有我需要工作，因爲initally可變因素，像這樣的元素試圖讓我的代碼有點整潔變量：

var templateDiv = $(".enquiry-step"); 
var holder  = $("#template-holder"); 

但是，其中一些元素實際上並不存在於頁面上。之後，我將他們加入（阿賈克斯），當我嘗試做這樣的事情：

templateDiv.fadeIn(250); 

它不工作，但這：

$(".enquiry-step").fadeIn(250); 

我想這是因爲var templateDiv = $(".enquiry-step");是實際上做的比我想象的要多 - 即。創建一個具有從元素派生的各種屬性的對象......如果該元素尚不存在於DOM中，則無法做到這一點？我對嗎？

如果是這樣，那麼是否有其他方式將句柄設置爲變量，或者我將不得不在整個代碼中引用這些元素，如$(".enquiry-step")？在元件已經被動態創建使用的console.log（）之後給出以下：：EDIT

的console.log（templateDiv）：

Object { length: 0, prevObject: Object, context: HTMLDocument → enquiries, selector: ".enquiry-step" } 

的console.log（ $（ 「查詢步驟」））;

Object { 0: <div.uk-grid.enquiry-step>, length: 1, prevObject: Object, context: HTMLDocument → enquiries, selector: ".enquiry-step" } 

請注意區別......我不明白爲什麼？

Answer 1

$(".enquiry-step") 

對$（）的調用調用創建返回給您的jQuery對象。基本上它是由選擇器編碼的dom元素的包裝。如果元素在對象創建時不存在，則包裝器在那裏，但它不引用任何DOM元素（請參閱.length爲0），並且它不會監視DOM樹以在這些元素更新時自動更新元素出現例如它完全是靜態的。我會建議爲你簡單地聲明你的變量

var holder; 

，並僅在該元素在DOM

holder= $(".enquiry-step"); 

基本上調用$（此刻的值賦給它）就像是使數據庫查詢 - 它只會返回結果，如果它們已經在數據庫中。