如何动态加载局部视图内的外部javascript？

Question

我正在使用jquery的.html（）函数将html文件注入到应用程序主页的部分div中。 在注入的部分html页面中，有一个javascript参考，例如script（src ='.. / .. / javascripts / partialFunctions.js'）。 jQuery函数和主页如下：

$('.partialDiv').html(htmlResult);

<div>main page</div>
<div class='partialDiv'></div>
<input type='button'>button</input>

当用户单击主应用程序页面上的特定按钮时，将调用jquery函数，并将html文件注入到主页。

问题在于，每次注入新的htm文件时，浏览器都会加载脚本文件。 因此，在用户多次单击按钮之后，将有许多重复的javascript函数。

我该如何动态地做到这一点并避免JavaScript函数的重复？

提前致谢！

Answer 1

您可以从htmlResult页面中删除脚本标记和引用。 然后使用$.getScript('myscript.js')导入必要的JavaScript文件。 有关getScript（）的更多信息，请参见此处

因此，要加载脚本并确保仅加载一次：

var window.foo = false; //Outside the document.ready

$('.partialDiv').html(htmlResult);
if(window.foo == false){
    $.getScript("js/myScript.js", function(data, textStatus, jqxhr){
        console.log('Script loaded');
        window.foo = true;
    });
}

Answer 2

我只是做了一个快速测试，当您调用.html()时，脚本标记似乎仍然被剥离了。 因此，您应该能够简单地执行以下操作：

var html = "<html><script></script></html>",
    cleanedHtml = $(html).html();
myEl.html(cleanedHtml);

如何动态加载局部视图内的外部javascript？

问题描述

2 个解决方案

解决方案1
1 已采纳 2012-11-21 21:53:29

解决方案2
0 2012-11-21 21:43:55

如何动态加载局部视图内的外部javascript？

问题描述

2 个解决方案

解决方案1 1 已采纳 2012-11-21 21:53:29

解决方案2 0 2012-11-21 21:43:55

解决方案1
1 已采纳 2012-11-21 21:53:29

解决方案2
0 2012-11-21 21:43:55