JQuery для загрузки файла Javascript динамически

Question

У меня есть очень большой файл javascript, который я бы хотел загрузить, только если пользователь нажмет на определенную кнопку. Я использую jQuery как свою структуру. Есть ли встроенный метод или плагин, который поможет мне сделать это?

Дополнительная информация: У меня есть кнопка «Добавить комментарий», которая должна загружать javascript-файл TinyMCE (я откинул все материалы TinyMCE до одного JS-файла), а затем позвоните tinyMCE.init (...).

Я не хочу загружать это при начальной загрузке страницы, потому что не каждый будет нажимать «Добавить комментарий».

Я понимаю, что я просто не могу сделать:

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

но есть лучший/инкапсулированный путь?

Answer 1

Да, используйте getScript вместо document.write - он даже позволит обратный вызов после загрузки файла.

Вы можете проверить, если TinyMCE определена, хотя, прежде чем включать его (при последующих вызовах «Добавить комментарий»), так что код может выглядеть примерно так:

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

Если у вас есть только звоните init на нем один раз, то есть. Если нет, то вы можете понять это отсюда :)

Answer 2

Я понимаю, что я немного поздно здесь, (5 лет или около того), но я думаю, что это лучший ответ, чем принято одно следующим образом:

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

getScript() функция фактически предотвращает кэширование браузера. Если запустить трассировку вы увидите сценарий загружаются с URL, который включает в себя параметр временной метки:

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

Если пользователь щелкает #addComment ссылки несколько раз, tinymce.js будет повторно загружен с по-разным timestampped URL. Это нарушает цель кеширования браузера.

===

Кроме того, в документации getScript() есть пример кода, который демонстрирует, как включить кэширование путем создания пользовательской cachedScript() функцию следующим образом:

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); 
}); 

===

Или, если вы хотите отключить кеширование по всему миру, вы можете сделать это, используя ajaxSetup() следующим образом:

$.ajaxSetup({ 
    cache: true 
});