पृष्ठ के बाद जावास्क्रिप्ट चलाना पूरी तरह से प्रस्तुत किया गया है

Question

मैं एक वाक्यविन्यास हाइलाइटर स्क्रिप्ट बनाने की कोशिश कर रहा हूं। मैंने 10 हजार लाइनों वाले कोड पर अपनी स्क्रिप्ट का उपयोग करने की कोशिश की और जो कुछ भी मैं लोड कर रहा हूं, वह एक खाली पृष्ठ है। स्क्रिप्ट समाप्त होने के बाद सब कुछ ठीक दिखाई देगा। वैसे, मैंने अपनी स्क्रिप्ट को jQuery के तैयार फ़ंक्शन के अंदर बुलाया। पृष्ठ के बाद पूरी तरह से प्रदान की गई है

$(myFunction); 

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

संपादित करें:

इस स्पष्ट, मैं के बाद सब कुछ "गाया" है "लोडेड" नहीं कोड निष्पादित करने के लिए चाहते हैं बनाने के लिए। स्क्रीन पर सब कुछ पहले से दिखाना चाहिए और उपयोगकर्ता वास्तव में कोड को जीवन में आ सकता है क्योंकि इसे हाइलाइट किया जा रहा है। धन्यवाद।

Answer 1

क्या आपका मतलब है कि सभी छवियों को लोड करने के बाद?

$(window).load(function() { 
    //dom not only ready, but everything is loaded 
}); 

Answer 2

नहीं

यकीन है कि वास्तव में कितना डेटा:

मुझे लगता है कि window.onload आप के लिए

window.onload = function() { 
    //dom not only ready, but everything is loaded 
}; 

संपादित

प्रति क्रिस की टिप्पणी क्या खोज रहे है, यहाँ jQuery रास्ता है लाया जा रहा है ... लेकिन अगर दस्तावेज़ तैयार हो तो आपने एक jquery AJAX कॉल चलाया और अपने hig को चलाने के लिए पूर्ण विधि का उपयोग किया हल्का समारोह? यदि बहुत सारे डेटा हैं तो यह धीमा पृष्ठ लोड होगा।

फिर भी इस

$.ajax({ 
      type: "POST", 
      url: "Where data is actually stored", 
      data: { ChannelTypeID: ChannelTypeID }, 
      datatype: "html", 
      beforeSend: function() { 

      }, 
      success: function (myHTML) { 
       $('body').html(myHTML); 
      }, 
      error: function() { 
       alert("Ajax request was unsuccessful"); 
      }, 
      complete: function() { 
       highlighterFunction(); 
      } 
     }); 

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

Answer 3

ऐसा करने का एक आसान तरीका देरी शुरू कर रहा है। इसे प्राप्त करने के लिए setTimeout() का उपयोग करें। उदाहरण के लिए: सेटटाइमआउट (func, 1000);

उपरोक्त पंक्ति 1000 मिलीसेकंड के इंतजार के बाद फ़ंक्शन "func" निष्पादित करती है। आपकी सामग्री को लोड करने में लगने वाले समय के आधार पर, सेटटाइमआउट में टाइमफील्ड (पैरामीटर) सेट करें।

उदाहरण उपयोग:

$(document).ready(function(){ 

function func() 
{ 
    alert("hi"); 
} 
setTimeout(func, 1000); 
}); 

आशा इस मदद करता है! window.onload साथ

Answer 4

समस्या

दृष्टिकोण भले ही आप $(window).load दृष्टिकोण का उपयोग, अपने हाइलाइटर सामान कुछ करने से पहले $(document).ready से पूरा करने को चलाने हो सकता है, के बाद से वहाँ अतुल्यकालिक कॉलबैक कार्यों के बहुत सारे सब कुछ खत्म हो सकता है स्थान।

मेरे दृष्टिकोण

मैं document.readyState == 'complete और setTimeout के लिए इंतजार का एक संयोजन का उपयोग करें। विचार यह है कि मैं पूरी तरह से प्रस्तुत होने तक प्रतीक्षा करना चाहता हूं (इसलिए 'complete') और फिर यह सुनिश्चित करें कि $(document).ready JQuery wrapper सामग्री पूर्ण हो गई है (इसलिए setTimeout)।

यहां बताया गया है कि मैं आपकी समस्या का समाधान कैसे करूंगा, यह मानते हुए कि 200 मिलीसेकंड $(document).ready(function(){ /*...*/ }); के अंदर सब कुछ के लिए पर्याप्त समय है।

function highlighterAction() { 
    // actually do the highlighting stuff here 
} 

function highlighter() { 
    /* 
     The short pause allows any required callback functions 
     to execute before actually highlighting, and allows 
     the JQuery $(document).ready wrapper to finish. 
    */ 
    setTimeout(function() { 
     highlighterAction(); 
    }, 200); 
} 

/* 
    Only trigger the highlighter after document fully loaded. This is 
    necessary for cases where page load takes a significant length 
    of time to fully load. 
*/ 
if (document.readyState == 'complete') { 
    highlighter(); 
} else { 
    document.onreadystatechange = function() { 
     if (document.readyState === "complete") { 
      highlighter(); 
     } 
    } 
}