Question

我是网络开发和js的新手。我理解一些js和jQuery，但还不足以编写有用的代码，所以我希望在这里得到帮助。我通过iFrame将一些第三方网络应用程序整合到我的网站中（弹出窗口和直接链接，这是最好的方式）并且有两个部分的问题。

1）网络应用程序不允许直接编码，只允许有限数量的CSS样式选项。我可以上传背景图片并更改背景颜色，但我无法使其透明。我想调整iframe，以便我的网站背景显示出来。根据Firebug，我可以简单地完全取出背景颜色选项，问题就解决了。

问题是这些应用程序位于不同的域上导致跨域问题，我想大多数代码都是服务器端使用动态视图控制器（在我脑海中），因此将代码直接合并到我的站点可能不行。我的“IT Guy”说我们应该能够在我的.php文件中定位iframe，并在加载iframe后更改样式，因为样式级联。但是，iframe以及页面上的其他内容都没有命名（没有类或id），所以为了定位它，我必须使用某种（“this”）。child.child（“body” “）之类的事情。到目前为止，我们没有尝试过任何工作。如果我可以定位iframe，我可以更改其他小问题，例如无法正确显示的按钮。

2）如果我设置iframe高度并且iframe显示比高度更长的东西，它会切断（显然）。我需要iframe具有动态高度，因此如果iframe的内容发生变化，iframe的高度也会发生变化。我已经看到了代码片段来做到这一点，但我不知道我在做什么，令人惊讶的是它没有用。如果有效，我希望能学到一点js魔法。

测试页面位于http://www.nightaliveent.com/builds/1.0/music.php。我可以提供我当前的代码，如果它会有所帮助，但我不想污染董事会。作为参考，网络应用程序是DJ智能工具，特别是（http://www.djintelligence.com/music）。

感谢您的帮助。每一点都有帮助，如果我不能让它工作，我将不得不停止使用网络工具。

Answer 1

“我的”IT Guy“说我们应该能够在我的.php文件中定位iframe，并在加载iframe后更改样式，因为样式会级联。”

这有很多错误。

加载iframe后，它已经是浏览器中的客户端。 PHP没有发言权
在当前DOM中级联样式。你的iFrame是一个完全不同的DOM的“漏洞”。您无法在来自其他域的iFrame中设置内容样式。

“我需要iframe具有动态高度，因此如果iframe的内容发生变化，iframe的高度也会发生变化”

我可以想到一些疯狂的服务器端黑客可能会计算出来，但是，唉，你可以做的也不多。

当您将其他网站加载到iFrame时，您必须记住它们不是您的网站。这不是你的代码。出于明显的安全原因，浏览器不会让您直接操纵iFrame的内容。

Answer 2

Kyle，如果父母和孩子的域名不同，你就无法访问iframe内容，在你的情况下是真的。父URL是“http://www.nightaliveent.com”，子域（第三方Web应用程序）是“http://www.nightaliveent.djintelligence.com/music”

如果您尝试在页面加载后访问iframe内容，则会抛出异常。

$("iframe").contents()

不安全的JavaScript尝试从包含网址http://www.nightaliveent.djintelligence.com/music/的网址访问包含网址http://www.nightaliveent.com/builds/1.0/music.php的框架。域，协议和端口必须匹配。

Answer 3

您只能在同一个域（安全性）上使用iframe时“访问”该内容，尝试从其他域访问该内容将永远不会有效。最好不要使用iframe（折旧），而是使用对象。对于某些IE版本，你需要一个iframe，因为IE不符合W3C（offtopic：IE在我看来是一块狗屎）。

如果要从其他站点加载内容PARTS，您可以执行的操作是使用ajax并在检索页面后过滤掉您想要的内容。请参阅jQuery.ajax函数，您可以定义成功和错误回调。例如：

$.ajax({
   async:true,
   cache:true,
   url: 'your url',
   success:function(s) { alert('the string is: '+s); <filter contents and set target> },
   error:function() { alert('failed'); }
});

希望有所帮助。

iframe js问题

3 个答案: