使用 jQuery .load 会中断指向其他库资源的链接？答案

【问题标题】：Using jQuery .load breaks links to other library resources?使用 jQuery .load 会中断指向其他库资源的链接？
【发布时间】：2008-11-19 19:18:53
【问题描述】：

我有一个带有 div 的简单 html 页面。我正在使用 jQuery 将 aspx 应用程序的内容加载到“内容”div 中。代码如下所示：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js">
    </script>
    <script type="text/javascript">
        jQuery.noConflict();
    </script>
</head>
<body>
    <div id="content">
        <div id="loading"> 
            <div class="loading-indicator">Loading...</div>
        </div>
    </div>
</body>
<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#content").load("default.aspx");
    });
</script>
</html>

问题是default.aspx 使用了shadowbox 和其他javascript 库。当该代码尝试在 default.aspx 上执行时，它就像未加载 js 源文件一样。我签入 firebug 并且 js 文件在那里（没有 404 或任何东西）。有人知道我错过了什么吗？如您所见，我使用了 jQuery noConflict 函数，因为我认为 $ 的使用可能与其他库发生冲突，但没有帮助...

【问题讨论】：

标签： javascript jquery shadowbox

【解决方案1】：

我有这样做的代码，它可能比需要的更冗长，但嵌套的 js 文件应该不是问题。

jQuery.get('default.aspx', null, function(data) {
    $('#default').append(data);
}, 'html');

【讨论】：

【解决方案2】：

未执行的代码是否呈现为脚本块，我了解加载的库，但任何脚本块或内联 javascript 在像这样动态加载时都不会执行。您必须想出一个解决方案来评估返回的脚本块是否有效。我看看能不能从原型中挖出一个例子，我记得他们有一个。

更新：

这是直接来自原型...

  ScriptFragment: '<script[^>]*>([\\S\\s]*?)<\/script>'

  extractScripts: function() {
    var matchAll = new RegExp(Prototype.ScriptFragment, 'img');
    var matchOne = new RegExp(Prototype.ScriptFragment, 'im');
    return (this.match(matchAll) || []).map(function(scriptTag) {
      return (scriptTag.match(matchOne) || ['', ''])[1];
    });
  }

  evalScripts: function() {
    return this.extractScripts().map(function(script) { return eval(script) });
  }

当然，您可以根据需要简化它，但是当页面动态返回时，您必须手动评估所有脚本，因为浏览器不会自动评估注入元素的脚本。

【讨论】：

【解决方案3】：

似乎是一个常见问题：http://andreineculau.wordpress.com/2006/09/29/ajax-ondemand-javascript-or-dynamic-script-tags/

我猜这是浏览器内置的安全功能，可以防止 ajax 响应运行任意脚本。

【讨论】：

我不认为这是一项安全功能。该过程是（1）通过ajax读取字符串。 (2) 将字符串转换为DOM元素。 (3) 将它们插入到文档中。 “运行任意脚本”出现在步骤 (3) 中。在步骤 (1) 之后，该字符串不再是“ajax 响应”。