9

我的概念是从 iframe 更新主页中文本框的值。此代码在 中有效firefox，但在Internet Explorerand中无效Chrome。两者main.html和frame.html都在同一个位置。我需要建议以使其在所有浏览器中都能正常工作。

main.html

<!DOCTYPE html>
<html>
<head>
<title> main window </title>
</head>
<body>
Parent textbox :<input type="text" id="parentbox"></br></br></br>
<iframe src="frame.html" ></iframe>
</body>
</html>

框架.html

<!DOCTYPE html>
<html>
<head>
<title> frame window </title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
function PushValues()
{
 var frame_value = document.getElementById("framebox").value;
 window.parent.document.getElementById("parentbox").value =frame_value;
}
</script>
</head>
<body>
<input type="text" id="framebox" >
<input type="button" value ="fill" onclick="PushValues()">
</body>
</html>
4

5 回答 5

2

根据安全策略，跨域访问受到限制。如果您尝试在域 2 中显示来自域 1 的页面并尝试从域 1 中的脚本操作域 2 中页面的 DOM，则会发生这种情况。如果您从服务器上的同一位置运行页面。这不应该发生。但是，如果您只是将它们保存为 HTML 文件并尝试在浏览器中打开它们，它应该不起作用。我为您的代码创建了两个 jsbin，它正在 chrome 上运行。尝试使用以下链接访问它们。

Main.html：http ://jsbin.com/afazEDE/1 iframe.html ：http: //jsbin.com/yacEXa/1/

通过在 chrome (F12) 中保持控制台打开并单击填充按钮，尝试在 JSBin 中以编辑模式运行 main.html。它不起作用，并会显示错误。如果您按原样运行它们（在 JSBin 的运行模式下），它将起作用。

于 2013-11-19T15:11:17.073 回答
1

在 xamp 或 wamp 之类的服务器上运行此代码，它不会直接工作

主.html

<!DOCTYPE html>
<html>

<head>
    <title> main window </title>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>

<body>
    Parent textbox :<input type="text" id="parentbox" value=""></br></br></br>
    <iframe src="iframe.html"></iframe>
    <script>
        window._fn = {
            printval: function (response) {
                $("input").val(response);
            },
        };
    </script>
</body>

框架

<!DOCTYPE html>
<html>
<head>
    <title> frame window </title>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>

<body>
    <input type="text" id="framebox">
    <input type="button" value="fill" onclick="PushValues()">

    <script language="javascript">
        function PushValues() {
            window.parent._fn['printval']($('input').val());
        }

    </script>
</body>

</html>
于 2013-08-31T16:00:25.090 回答
1

jQuery -

function PushValues()
{
  var frame_value = $('#framebox').val();
  parent.$('body').find('#parentbox').val(frame_value);
}

它总是对我有用。

于 2013-07-22T07:30:40.417 回答
0

您应该尝试与 iframe 和 Internet Explorer 高度相关的 P3P 策略。设置为 iframe 文档的响应标头

header key= 'P3P'   header value: 'CP="IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT"'
于 2013-11-19T12:12:09.997 回答
0

由于您使用的是 jQuery 试试这个

var frame_value = $('#framebox').val();
$('#parentbox', window.parent.document).val(frame_value);
于 2013-07-22T07:25:33.387 回答