2010-11-01 13 views
6

मेरी साइट पृष्ठ के बड़े हिस्से पर नेविगेशन करने के लिए jquery.load() का उपयोग कर रही थी। मैं वास्तव में क्षमता की सराहना करने के केवल केवल भरी हुई सामग्री के किसी विशेष भाग, यहाँ आईडी = "सामग्री" के साथ div में शामिल हैं:jquery.ajax() लोड किए गए पृष्ठों में चल रहे स्क्रिप्ट दस्तावेज़ चलाते हैं। पहले से ही

$(frame_selector).load(url +" #content", function(response, status, xhr) {...}); 

लेकिन अब मैं स्क्रिप्ट है कि पृष्ठों का हिस्सा हैं चलाने के लिए सक्षम होने की जरूरत है गतिशील रूप से लोड किया जा रहा है। Jquery.load() इन स्क्रिप्ट को स्ट्रिप्स करता है, लेकिन jquery.ajax() नहीं करता है। इसलिए मैं इस तरह के रूप में एक ajax कॉल में jquery.load का आंशिक-सामग्री कार्यक्षमता दोहराया:

$.ajax({ 
    url: url, 
    dataType: 'html', 
    success: function(data, textStatus, XMLHttpRequest) { 
     // Only include the response within the #content id element. 
     $(frame_selector).html(jQuery("<div>") 
      .append(data) 
      .find("#content") 
    ); 
    } 
}); 

समस्या यह है कि स्क्रिप्ट जो गतिशील ajax कॉल से लोड किया जा रहा है मज़बूती से नहीं चल रहे हैं है। कभी-कभी उन्हें कोई प्रभाव नहीं पड़ता है, शायद इसलिए कि वे बहुत जल्दी चल रहे हैं। स्क्रिप्ट सिर्फ jquery में डोम मैनिपुलेशन कर रही हैं - छवियों या फ़्लैश या किसी भी चीज़ पर निर्भर नहीं है जो अभी तक लोड नहीं होने वाली है। अटकने से बचने के लिए मेरे पास काम करने के लिए यह भयानक हैक है। AJAX-लोडेड स्क्रिप्ट सिर्फ उपयोग करने के बजाय:

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

मैं चलाने से पहले स्क्रिप्ट 200 मि.से देरी:

$(document).ready(window.setTimeout(function() {...}, 200)); // HATE THIS 

किसी को पता है कि कैसे मैं एक देरी हार्ड-कोड के बिना मज़बूती से यह काम कर सकते हैं? मुझे लगता है कि यह <script> और #content को एक नए div में लोड करने के लिए मेरी तर्क है, लेकिन मुझे यकीन नहीं है कि इसके बारे में क्या करना है।

+0

आप डेटा पकड़ने के लिए सिंक्रोनस अनुरोध कर सकते हैं। – dz1984

+0

यह एक भयानक विचार है। सिंक्रोनस अनुरोध निष्पादित होने पर आपका ब्राउज़र UI लॉक हो जाएगा। –

उत्तर

7

मुझे लगता है कि स्क्रिप्ट्स डीओएम तत्वों पर हेरफेर कर रही हैं जो आप AJAX के माध्यम से जोड़ रहे हैं।

jQuery में isReady संपत्ति है जो इसे ready ईवेंट पृष्ठ पर ट्रिगर करने के बाद सेट हो जाती है।

किसी भी बाद की कॉल jQuery.ready(...) पर पहले isReady ध्वज की जांच करेगा। अगर ध्वज सत्य पर सेट किया गया है, तो यह तुरंत हैंडलर को कॉल करेगा। आप देख सकते हैं कि यह आपके कोड में समस्या क्यों पैदा करेगा।

एक विकल्प एक jQuery खंड में प्रतिक्रिया लोड करना होगा और बाद में निष्पादन के लिए सभी <script /> टैगों को पार्स करना होगा।

var ajaxResponse = $(html); 
var scripts = ajaxResponse.find('script'); 

// Move your scripts into a new element 
var tempScripts = $().append(scripts); 

// Append your content, followed by your script tags 
$(document).append(ajaxResponse); 
$(document).append(tempScripts); 
+0

यह बहुत अच्छा है, धन्यवाद! – Neo

+0

यह मेरे लिए काम नहीं करता है। समस्या यह प्रतीत होती है। ढूँढें() स्क्रिप्ट ढूंढने में विफल रहता है ... – ekkis

1

@Dan का उत्तर है। AJAX के माध्यम से स्क्रिप्ट लोड करते समय दस्तावेज़ isReady सत्य है। इसका मतलब यह है कि अगर यह स्क्रिप्ट टैग है कि अपने ajax अनुरोध से अनुरोध किया जाता है:

<script type="text/javascript"> 
    if (jQuery.isReady) { 
     $('body').append("<div id='new_content'>Document Ready</div>"); 
    } 
    else { 
     $('body').append("<div id='new_content'>Document Not Ready</div>"); 
    } 
</script> 

पार्स करने के बजाय JSON का उपयोग करें। एक संपत्ति एचटीएमएल रखेगी। एक और संपत्ति स्क्रिप्ट पकड़ लेगी। यदि आप आप कोड यह एक बंद पैदा करेगा आसपास तैयार समारोह के साथ स्क्रिप्ट लोड

$(document).append(ajaxResponse.html); 
$(document).append(ajaxResponse.script); 

इसके अलावा:

तो फिर तुम यह कर सकते हैं। यह बंद पृष्ठ के जीवनकाल तक चलेगा। जब भी आप अपने पृष्ठ को रीफ्रेश किए बिना उस स्क्रिप्ट का अनुरोध करते हैं तो मेमोरी लीक बनाए जाएंगे

संबंधित मुद्दे