JQuery per caricare dinamicamente il file Javascript

Ho un file javascript molto grande che vorrei caricare solo se l'utente fa clic su un determinato pulsante. Sto usando jQuery come il mio framework. Esiste un metodo o plug-in integrato che mi aiuterà a farlo?

Qualche dettaglio in più: ho un pulsante "Aggiungi commento" che dovrebbe caricare il file javascript TinyMCE (ho ridotto tutto il materiale TinyMCE in un singolo file JS), quindi chiama tinyMCE.init (...).

Non voglio caricarlo al caricamento della pagina iniziale perché non tutti faranno clic su "Aggiungi commento".

Capisco di poter semplicemente fare:

$("#addComment").click(function(e) { document.write("<script...") });

ma esiste un modo migliore / incapsulato?

Sì, usa getScript invece di document.write: consentirà anche di richiamare una volta caricato il file.

Potresti voler verificare se TinyMCE è definito, tuttavia, prima di includerlo (per le chiamate successive a "Aggiungi commento") in modo che il codice possa assomigliare a questo:

$('#add_comment').click(function() {
    if(typeof TinyMCE == "undefined") {
        $.getScript('tinymce.js', function() {
            TinyMCE.init();
        });
    }
});

Supponendo di doverlo fare solo inituna volta, cioè. Altrimenti, puoi capirlo da qui :)

Mi rendo conto di essere un po 'in ritardo qui (circa 5 anni), ma penso che ci sia una risposta migliore di quella accettata come segue:

$("#addComment").click(function() {
    if(typeof TinyMCE === "undefined") {
        $.ajax({
            url: "tinymce.js",
            dataType: "script",
            cache: true,
            success: function() {
                TinyMCE.init();
            }
        });
    }
});

La getScript()funzione impedisce effettivamente la memorizzazione nella cache del browser . Se esegui una traccia, vedrai che lo script viene caricato con un URL che include un parametro timestamp:

http://www.yoursite.com/js/tinymce.js?_=1399055841840

Se un utente fa clic #addCommentpiù volte sul collegamento, tinymce.jsverrà ricaricato da un URL con timestamp diverso. Ciò vanifica lo scopo della memorizzazione nella cache del browser.

===

In alternativa, nella getScript()documentazione è presente un codice di esempio che dimostra come abilitare la memorizzazione nella cache creando una cachedScript()funzione personalizzata come segue:

jQuery.cachedScript = function( url, options ) {

    // Allow user to set any option except for dataType, cache, and url
    options = $.extend( options || {}, {
        dataType: "script",
        cache: true,
        url: url
    });

    // Use $.ajax() since it is more flexible than $.getScript
    // Return the jqXHR object so we can chain callbacks
    return jQuery.ajax( options );
};

// Usage
$.cachedScript( "ajax/test.js" ).done(function( script, textStatus ) {
    console.log( textStatus );
});

===

In alternativa, se si desidera disabilitare la memorizzazione nella cache a livello globale, è possibile farlo nel modo ajaxSetup()seguente:

$.ajaxSetup({
    cache: true
});