iFrame中的jquery访问元素

Question

我有一个页面，里面有一个iframe元素。 该iFrame内部包含两个级别的document 。

这是代码的简短版本（删除了大多数内容，否则太大了）

<iframe src="some soruce" width="863" height="486" frameborder="0" scrolling="no">
    <html>
        <head>...</head>
          <body>
              <iframe id="player" src="some source" width="863" height="486" frameborder="0" scrolling="no">
                <html>
                    <head>...</head>
                    <body>
                      <div id="mediaplayer_wrapper" style="position: relative; width: 863px; height: 486px;">
                        <object type="application/x-shockwave-flash" data="/new-flash-player/player.swf" width="100%" height="100%" id="mediaplayer" name="mediaplayer" tabindex="0"></div></div>
                      <div id="banners_area" style="position: absolute; top: 0px; left: 0px; width: 863px; height: 486px; display: none; background-color: white;">
                              <br>
                      </div>
                    </div>
                    </body>
                </html>             
              </iframe>
        </body>
    </html>
</iframe>

我想做的是通过jQuery访问mediaplayer对象并触发一个函数。 我尝试了以下方法：

var p = jQuery("mediaplayer");
p.hideGate();

并且

var p = $("#iFrame").contents().find("#mediaplayer");
p.hideGate();

但他们都没有成功。 （给我一个hideGate的错误。但是，在开发人员身份下，我将自己切换到该特定播放器的内容，并执行第一个代码，它突然起作用了。

我在这里做错了什么？ 为什么我不能触发功能？

Answer 1

hideGate不是标准的jQuery方法。 它必须由插件提供。

您有多个文档，并且该插件已加载到带有#mediaplayer元素的框架文档中的jQuery版本中。

当您从父框架调用jQuery时，您正在使用的是jQuery的版本…… 未安装插件。

您可以通过将插件脚本加载到父框架中的文档中来解决此问题。

否则，您需要从框架中的文档中调用jQuery函数。 （可能$("#iFrame")[0].contentWindow.jQuery("#mediaplayer")可以做到这一点，但是我现在没有时间写一个测试用例来确定）。

Answer 2

也许您想尝试.contentWindow属性，如下所示： http : //www.w3schools.com/jsref/prop_frame_contentwindow.asp

希望能帮助到你。