10

我想在另一个网站上自动填充文本框，所以我正在编写一个简短的脚本来做到这一点。我正在加载一个包含网站的 iframe，如果加载了这个 iframe，它应该填写输入文本表单。所以我写了这个autofill.php：

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="fill.js"></script>
<iframe name="autofillframe" src="https://e-services.blum.com/main/" style="width:100%; height:100%;"></iframe>

这是我写的fill.js：

$(document).ready(function(e) {
    $('#username').val('username');
    $('#kennwort').val('password');
});

这是一个小提琴

如果我使用 .php 文件而不是网站来执行此操作，则它可以正常工作。这是一个没有网站的演示

有人可以给我一个提示吗？

4

2 回答 2

25

当您将来自不同域的页面加载到 中iframe时，您无法通过页面中的 JavaScript 对 iframe 页面执行任何操作。

就浏览器而言，iframe 是一个单独的窗口，您无权访问它。假设用户在一个窗口中打开了银行页面，而您的页面在另一个窗口中打开。您知道浏览器不会让您的 JavaScript 代码干扰银行页面，对吧？

当另一个页面位于iframe. 它仍然是一个完全独立的浏览器窗口，它只是被定位，所以它看起来像是在您的页面内。

在您的工作示例中，代码有效，因为用户名和密码字段不在iframe不同的域中。它们是 JavaScript 代码所在页面的一部分。

如果iframe从与您的主页相同的域加载，那么您可以对其执行任何操作，包括填写表单字段。代码会略有不同，因为您需要访问iframe文档而不是主页文档，但这很容易。但是，如果iframe来自不同的域，那么您就不走运了。

于 2013-10-03T06:57:48.703 回答
3

通过按下提交按钮，输入值从输入文本框复制到 iframe 文本框（或与之相反）。你可以像这样实现它：

test1.html

<!doctype html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $('#submit').click(function(){
                var iframe = document.getElementById('myiframe');
                var doc = iframe.contentDocument || iframe.contentWindow.document;
                var elem = document.getElementById('username');
                doc.getElementsByName('user')[0].value = elem.value;
            });
        });
    </script>
</head>
<body>
    <input type="text" id="username">
    <input type="submit" id="submit">
    <iframe id="myiframe" frameborder="1" src="test2.html"></iframe>
</body>
</html>

和 test2.html ：

<!DOCTYPE html>
<html>
<body>
    <input type="text" name="user" id="user">
</body>
</html>
于 2016-08-26T20:53:40.170 回答