ajax成功加载多个js文件 - javascript

时间:2017-11-11 09:53:07

标签: javascript jquery ajax

所以现在我有这个代码。在ajax成功它动态加载我的js文件。但我的观点是..有什么方法可以让我们一次性加载它们而不必一个一个地输入它们?通过文件夹/ * .js然后它将加载该文件夹中的所有js文件。这是我的示例代码。

JS

$(document).ready(function() {
$(document).on("click", "a[rel=tab]", function(e) {
    // e.preventDefault();
    $e = $(e);
    pageurl = $(this).attr('href');
    $.ajax({
        url: pageurl + '?rel=tab',
        success: function(data) {

            var head = document.getElementsByTagName("head")[0];
            var jquery = document.createElement("script");
            jquery.type = "text/javascript";
            jquery.src = base_url + "/assets/bower_components/datatables.net/js/jquery.dataTables.min.js";
            head.appendChild(jquery);

            var js = document.createElement("script");
            js.type = "text/javascript";
            js.src = base_url + "/assets/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js";
            head.appendChild(js);

            var jsn = document.createElement("script");
            jsn.type = "text/javascript";
            jsn.src = base_url + "/assets/js/newscript.js";
            head.appendChild(jsn);
            jsn.onload = function() {
                $('#inside').html(data);
            }
        }
    });

    //to change the browser URL to 'pageurl'
    if (pageurl != window.location) {
        window.history.pushState({ path: pageurl }, '', pageurl);
    }
    return false;
});

$(window).bind('popstate', function() {
    $.ajax({
        url: location.pathname + '?rel=tab',
        success: function(data) {
            $('#inside').html(data);
        }
    });
});
});

1 个答案:

答案 0 :(得分:1)

使用以下代码回答问题here

const getScripts = 
  resources => {
    jQuery.when.apply(
      null
      ,resources.map(
        resource =>
          $.getScript(base_url + resource)
        )
    )
;

getScripts(["url1","url2"])
.then(
  () => console.log("finished loading scripts")
  ,err => console.warn("Failed:",err)
);

我认为你需要重新考虑你的设计,再次加载一堆脚本。您只需要通过xhr设置一些内容(不是使用xhr请求html部分的忠实粉丝)并使用脚本初始化内容。

您应该调用一个初始化内容的函数,而不是重新加载所有脚本。