2011-01-04 15 views
6

Bir HTMLScriptElement öğesinin zaten yüklü olup olmadığını belirlemek için javascript'i nasıl kullanabilirim? Dinamik olarak yüklenen komut onload veya onreadystate değişim olayları kullanarak olmadan yükleme bittikten eğerJavascript onload olayı - komut dosyasının yüklü olup olmadığını nasıl anlayacaksınız?

nasıl belirleyebilir?

TOOL.loadScript = function (url, callback, reappend, deepSearch) { 
     var head, curr, child, tempScript, alreadyAppended, queue, 
     alreadyHandled, script, handler, loadFunc; 

     head = document.getElementsByTagName("head")[0]; 
     tempScript = document.createElement("script"); 
     tempScript.src = url; 
     alreadyAppended = false; 

     queue = []; 

     if (deepSearch) { 
     // search entire document 
     queue.push(document.firstElementChild); 
     } 
     else { 
     // just search the head element 
     queue.push(head); 
     } 

     while (queue.length !== 0) { 
     curr = queue.shift(); 

     // add child nodes to queue 
     child = curr.firstElementChild; 
     if (child !== null && child !== undefined) { 
      queue.push(child); 
      child = child.nextElementSibling; 
      while (child !== null && child !== undefined) { 
       queue.push(child); 
       child = child.nextElementSibling; 
      } 
     } 

     if (curr.tagName !== null && curr.tagName !== undefined) { 
      if (curr.tagName.toLowerCase() === "script" && curr.src === tempScript.src) { 
       script = curr; 
       alreadyAppended = true; 
       break; 
      } 
     } 
     } 

     if (!alreadyAppended) { 
     script = document.createElement("script"); 
     script.type = "text/javascript"; 
     script.async = true; 
     script.src = url; 
     } 

     alreadyHandled = false; 

     handler = function (event) { 
     console.log("handling event..."); 
     if (!alreadyHandled) { 
      if ((!event.readyState) || (event && (event.readyState === "loaded" || event.readyState === "complete"))) { 
       alreadyHandled = true; 
       callback.apply(script, [url]); 
       if (loadFunc) { 
        loadFunc.apply(script, arguments); 
       } 
      } 
     } 
     }; 

     if (script.onreadystatechange === undefined) { 
     loadFunc = script.onload; 
     script.onload = handler; 
     } 
     else { 
     loadFunc = script.onreadystatechange; 
     script.onreadystatechange = handler; 
     } 

Burada yardıma ihtiyacım var şu şekildedir:

Kod olduğunu. Geri çağırma işlevinin alreadyAppeneded === true ve aynı betik zaten yüklenmiş olsa bile, ancak yalnızca bu komut dosyasının yüklenmesi tamamıyla bitmiş olsa bile tetiklenmesini istiyorum.

 if (!alreadyAppended || (alreadyAppended && reappend)) { 
     head.appendChild(script); 
     } 
    }; 

Bottom Line: Bir komut dosyası yüklenmesi tamamlandıktan eğer nasıl belirliyorsunuz? Gerekirse bana sorularınızı sorun.

Teşekkür ederiz.

cevap

2

Tembel Uygulama: Yüklenen tüm komut dosyalarının kaynağını üzerine yüklemek için kullanabileceğiniz bir dizi oluşturun ve bunlar yüklendikçe listeye sürükleyin. Her defasında, verilen src'nin dizide olup olmadığını kontrol edin, eğer öyleyse, hemen geri çağırın.

Eklenen, ancak yüklenmediğinde durumla ne yaptığınız sorusu olur. Geri çağrının ateşlenmesini istiyorsanız, ancak yüklendikten sonra ateş etmesini istiyorsanız, anahtar olarak bir src ile ilişkilendirici bir dizi ve kod öğesi de değer olarak kullanabilirsiniz. Buna içine kanca gerekebilir diğer koda sahip

var temponload = element.onreadystatechange || element.onload; 
if (element.onreadystatechange === undefined) 
    element.onload = function(e) { temponload(); temponload(); }; 
else 
    element.onreadystatechange = function (e) { temponload(); temponload(); }; 

, ama bu umutla başlamanızı sağlayacaktır: Oradan, şöyle orijinali sararak iki kez onload veya onreadystatechange yangını olun.

1

Bir komut dosyasının ne zaman yüklendiğini gerçekten söyleyemezsiniz. Kontrol etmek istediğiniz komut dosyasına global bir değişken koyabilir ve varlığını test edebilirsiniz.

Komut dosyalarını dinamik olarak yüklemek ve böylece gerçekte ne zaman yüklendiklerini öğrenmek için LABjs (Yükleme ve Engelleme Javascript) adlı yeni bir proje var (http://blog.getify.com/2009/11/labjs-new- hotness-for-script-loading/< - bir kontrol edin)

3

Neden betik elemanına bir kimlik eklemiyorsunuz? Devam etmeden önce kimliğin var olup olmadığını kontrol edin ....

function includeJs(jsFilePath) { 

    if (document.getElementById(jsFilePath+"_script")) { 
    return; 
    } 
    var js = document.createElement("script"); 

    js.type = "text/javascript"; 
    js.id = jsFilePath+"_script"; 
    js.src = jsFilePath; 

    document.body.appendChild(js); 
} 
+3

Not * Bu, aslında yüklenen herhangi bir öğenin, yalnızca öğenin oluşturulduğunu doğrulamaz. – Stephen

+0

İnsan ... bana bu olasılığı hatırlattığın için çok teşekkür ederim. Aynı sayfaya eklenmiş olan çift komut dosyalarını çözmeyi denedim ve şimdi düzeltildi. Bunu sadece 6 saat önce görmüşsem. : D –

İlgili konular