如果跨域，如何获取位于iframe内的文本字段中的文本？

Question

我有一个表单，我在其中获取了一个文本字段，并在其中调用了一个iframe，在该iframe中有一个用于Name的文本字段。我想使用JavaScript/jQuery在我的表单文本字段中显示Name。我的意思是，虽然我在Name文本字段中输入了一些内容，但它将显示在我的输入字段中。

我从另一个域调用iframe。我使用了以下代码

<script> 
var iframe = document.getElementById('progressive');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var usernameTextBox = innerDoc.getElementById('ApplicantInfo1_FirstName');
usernameTextBox.focus();
</script>

Answer 1

这应该是可行的：

var windowjQuery = $('#progressive')[0].contentWindow.$;
var f = $('#progressive').contents().find('#ApplicantInfo1_FirstName');

更新：

您可以在related question，bec上阅读有关此主题的更多信息。我现在不可能设置环境来测试这个特定的情况。

关键是，您应该调用<iframe> jQuery对象($)，而不是父页面的对象。

Answer 2

在您的父页面中，您是否控制域名？如果是，请创建一个子域。假设您的父页面名为example.com，然后创建一个子域iframe.example.com

在您的父页面中，您只需设置

document.domain = "example.com";

带有的子域将被视为安全域，您将被允许在两个页面之间交谈。

这里有一个更广泛的描述：Ways to circumvent the same-origin policy

Answer 3

我不确定这在跨域中是否有效，但你可能想看看jQuery .bind()。

下面是.bind()的一个示例

$('#progressive').load(function() {
  $(this)
    .contents()
    .find('#ApplicantInfo1_FirstName')
    .bind('keydown', function() {
        //  do stuff
    });
});

更多/更好的详细信息here on W3schools和一个现场演示here。但这些不是跨域的。还有更多的例子here。

否则，下面是一个关于如何从父iframe访问子iframe中的javascript的示例：

document.getElementById('ApplicantInfo1_FirstName').contentWindow.yourfunction()