JQuery动态加载Javascript文件

我有一个非常大的javascript文件，我只想在用户单击某个按钮时加载它。我使用jQuery作为我的框架。是否有一个内置的方法或插件可以帮助我做到这一点

更多细节： 我有一个“添加注释”按钮，它应该加载TinyMCE javascript文件（我已经将所有TinyMCE内容分解为一个JS文件），然后调用TinyMCE.init（…）

我不想在初始页面加载时加载，因为不是每个人都会单击“添加评论”

我明白我可以做到：

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

$（“#addComment”）。单击（函数（e）{document.write（Yes，使用而不是document.write）-文件加载后，它甚至允许回调

但是，在包含TinyMCE之前（对于后续的“添加注释”调用），您可能需要检查是否定义了TinyMCE，因此代码可能如下所示：

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

假设你只需要对它调用一次
init
，如果没有，你可以从这里找到答案：）
我意识到我来晚了一点（大约5年），但我认为有一个比公认的更好的答案，如下所示：

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

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({
    cache: true
});

该函数实际上阻止浏览器缓存。如果运行跟踪，您将看到脚本加载了包含时间戳参数的URL：

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

如果用户多次单击
#addComment
链接，
tinymce.js
将从不同的时间戳URL重新加载。这会破坏浏览器缓存的目的

===

或者，在文档中有一些示例代码，演示如何通过创建自定义的
cachedScript（）
函数来启用缓存，如下所示：

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

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({
    cache: true
});

===

或者，如果要全局禁用缓存，可以使用以下方法执行此操作：

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

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({
    cache: true
});

@何塞：谢谢：），@Jeff:没问题。就jQuery的卓越性而言，这一点是相当未知的。TLDR；仅当脚本位于同一目录中时才执行此操作。更长的版本：getScript实际上将javascript注入当前脚本而不是页面。这意味着包含的javascript上的任何路径都将相对于当前文档。这这是TinyMCE压缩器的一个很好的分支，它通过jQuery.TinyMCE插件添加了TinyMCE的异步加载，并包括Gzip、连接和缩小：这可能在编写本文时不可用，但请注意，jQuery允许（全局）禁用此无缓存功能并再次允许缓存。请参阅（哦，我看到这里也提到了您介绍的$.ajax（）方法。）@PeterHansen-感谢您的提示。我用您的建议更新了我的答案。jQuery 1.12.0或更高版本支持禁用反缓存内联，如下所示：
$.getScript（{url:“test.js”，cache:true}）