jQuery 不适用于 iframe 内容

Question

当使用 jQuery 聚焦输入字段时，我正在尝试将 css 应用于标签，但它似乎不起作用。联系人表单加载到 iframe 中。如果不使用 iframe，它工作正常 - 检查这个 jsfiddle:http://jsfiddle.net/nN3w2/ (如果 iframe 没有加载服务器可能会崩溃 - 但代码在那里供您查看)。

iframe 和联系表单位于同一域中。使用 php 将联系表包含在我的网站中。

<script type="text/javascript">
jQuery(document).ready(function($) {
    $("#iframe").contents().find("input").focus(function() {
        $("#iframe").contents().find("label").css('opacity','0');
    });
});
</script>

非 iframe

<script type="text/javascript">
jQuery(document).ready(function($) {
    $("input").focus(function() {
       $("label").css('opacity','0');
    });

    $("input").focusout(function() {
         if($("input").val() ==="" ) {
           $("label").css('opacity','1');
        }
    });

});
</script>

Answer 1

不可能

您不能将 jQuery 应用于其他域的 iframe。由于安全原因，它被阻止了。

扩展“不可能”...

“Same origin policies”适用:您与来自另一个[domain|subdomain|protocol|port] 的 iframe 内容通信的唯一方式是通过 postMessage API ，这当然需要另一部分(iframe 内的文档)来收听您的消息。

OP评论后更新

也许你可以这样做

$('#iframeOne', window.parent.document);

另一种方法

window.parent.$("#iframeOne");

另一种方式

$("#iframeOne", top.document);

如果知道父窗口的名称，也可以这样做

$("#iframeOne",opener.document)

这里的opener是窗口的名字。