使用 jQuery .load 会破坏与其他库资源的链接吗？

发布于 2024-07-08 11:37:44 字数 1072 浏览 6 评论 0原文

我有一个带有 div 的简单 html 页面。我正在使用 jQuery 将 aspx 应用程序的内容加载到“content”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 函数，因为我认为 $ 的使用可能与其他库冲突，但没有帮助......

原文

I have a simple html page with a div. I am using jQuery to load the contents of an aspx app into the "content" div. Code looks like this:

<!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>

The problem is default.aspx uses shadowbox and other javascript libraries. When that code tries to execute on default.aspx it acts like the js source files were not loaded. I check in firebug and the js files are there (no 404 or anything). Anyone know what I'm missing? As you can see I used the jQuery noConflict function because I thought the use of $ might be conflicting with the other libraries but no help there...

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

浮世清欢 2024-07-15 11:37:44

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

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

I have code doing this, it might be more verbose than is needed, but nested js files shouldn't be a problem.

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

回复收藏 0 原文

唐婉 2024-07-15 11:37:44

未执行的代码是否以脚本块的形式呈现，我了解加载的库，但任何脚本块或内联 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) });
  }

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

Is the code that is not executing rendered out as script blocks, I understand the libraries loaded but any script blocks or inline javascript will not execute when loaded dynamically like that. You have to come up witha solution that will evaluate the script blocks returned for any of it to be valid. I'll see if I can dig an example from prototype, I remember them having one.

UPDATE:

This is straight from prototype...

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

Of course you can simplify that for your needs, but when a page is returned dynamically you have to manually evaluate all scripts as the browser will not evaluate script injected into the element automagically.

回复收藏 0 原文