代码之家 › 专栏 › 技术社区 › homersimpson

如何在框架内加载jQuery?

html-frames frameset html jquery javascript

3

homersimpson · 技术社区 · 7 年前

我正在开发一个遗留企业应用程序,其代码是在2001年使用JavaScript、HTML、系统间Cach和Cach Weblink的组合编写的。

index.html 对于web应用程序:

<HTML>
<HEAD>
</HEAD>

<FRAMESET ROWS="32,*" FRAMEBORDER="no" border="0" framespacing="0">
  <FRAME
        SRC="sysnav.html"
        NAME="sysnav"
        SCROLLING="no"
        MARGINHEIGHT="10"
        MARGINWIDTH="10"
        NORESIZE>
  <FRAME
        SRC="cgi-bin/nph-mgwcgi?MGWLPN=dev&wlapp=SYSTEM&SystemAction=DisplayContentFrame"
        NAME="content"
        SCROLLING="auto"
        MARGINHEIGHT="0"
        MARGINWIDTH="10">
</FRAMESET>
<noframes>

</noframes>

</HTML>

我的问题是 content 框架,该框架的HTML每次都会自动生成,但我需要在框架中包含jQuery。

所容纳之物

2 回复 | 直到 7 年前

1

4

Community kfsone 4 年前

正如在评论中提到的那样,只要框架在同一个域上,jQuery就可以被注入到框架中。

可以将下面这样的脚本标记添加到 <head> 指数html . 它会等待,直到通过加载内容帧 addEventListener() <script> src公司 指向由托管的jQuery代码的属性 Google Hosted Libraries .

<script type="text/javascript">
window.addEventListener('DOMContentLoaded', function() {
    frames['content'].addEventListener('load', function() {
        var contentFrameHead = frames["content"].document.getElementsByTagName("head")[0];
        var newScriptTag = document.createElement('script');
        newScriptTag.src = 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js';
        contentFrameHead.appendChild(newScriptTag);
      });
});
</script>

请参见中的演示 this plunker example . 尝试单击标记的按钮 测试这个框架中加载的jQuery? 指数html .

在索引中使用jQuery。html

,可以使用jQuery助手函数。我试图利用它们来缩短代码,但在尝试使用创建脚本标记时遇到了问题 $() this answer 详细解释为什么这行不通。

因此,使用jQuery辅助函数的代码不会短得多。。。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>-->
<script type="text/javascript">
$(function() { //DOM-ready
  $(frames['content']).on('load', function() { //load for content frame
    var newScriptTag = document.createElement('script');
    newScriptTag.src = 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js';
    var contentFrameHead = frames["content"].document.getElementsByTagName("head")[0];
    contentFrameHead.appendChild(newScriptTag);
  });
});

否则,如果内容框架的域与 指数html

2

Mels_D 7 年前

没有,但您可以创建一个新页面并将其包含在src中。是的,它很难看,但在某些情况下可能有效。