pagina funcion ejecutar despues cargar carga bootstrap asincrona antes javascript jquery jquery-plugins widget

javascript - funcion - ¿Cómo cargar apropiadamente los complementos de jQuery en un sitio web de terceros?



ejecutar javascript despues de cargar pagina (0)

Estoy construyendo un widget que utiliza algunos plugins jQuery para trabajar.

Se implementa a través de:

<script src="http://example.com/widget"></script> <div id="widget"></div>

Y el script recuperado se ve así:

(function() { var jQuery; // Look for jQuery on page; if there, use it, otherwise fetch it if (window.jQuery === undefined || window.jQuery.fn.jquery !== ''2.1.3'') { loadScript("//code.jquery.com/jquery-2.1.3.min.js", scriptLoadHandler); } else { jQuery = window.jQuery; loadExternalLibraries(); main(); } // Fetch 3rd party libraries from server function loadExternalLibraries() { <% widget_javascripts.each do |filename| %> var url = "//example.com/widget/javascripts/" + "<%= filename %>"; loadScript(url, function() { console.log("Added " + "<%= filename%>"); }); <% end %> } function loadScript(url, callback) { /* Load script from url and calls callback once it''s loaded */ var scriptTag = document.createElement(''script''); scriptTag.setAttribute("type", "text/javascript"); scriptTag.setAttribute("src", url); if (typeof callback !== "undefined") { if (scriptTag.readyState) { /* For old versions of IE */ scriptTag.onreadystatechange = function () { if (this.readyState === ''complete'' || this.readyState === ''loaded'') { callback(); } }; } else { scriptTag.onload = callback; } } (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(scriptTag); } function scriptLoadHandler() { jQuery = window.jQuery.noConflict(true); loadExternalLibraries(); main(); } function main() { jQuery(document).ready(function($) { $(''#widget'').plugin1(); }); } })();

jQuery parece cargar bien, pero $(''#widget'').plugin1() devuelve el clásico TypeError: $(...).plugin1 is not a function .

Así que traté de seguir esta publicación ( http://alexmarandon.com/articles/widget-jquery-plugins/ ) y envolví el complemento en otra función y le pasé la variable jQuery local así:

// Plugin1 code function initPlugin1(jQuery) { (function ($) { # plugin code here }(jQuery)); } // modified loadExternalLibraries function function loadExternalLibraries() { % widget_javascripts.each do |filename| %> var url = "//example.com/widget/javascripts/" + "<%= filename %>"; loadScript(url, function() { initPlugin1(jQuery); }); <% end %> }

Además de que se me recuerda que initPlugin1 is not defined para cada otra biblioteca de complementos recuperada, sigo obteniendo el error TypeError original.

Asumiendo que tengo de 4 a 5 plugins de ese tipo (sin que ninguno también sea posible), ¿me estoy acercando a este problema de la manera correcta?