如何从另一个页面更改 iframe src答案

【问题标题】：How to change iframe src from another page如何从另一个页面更改 iframe src
【发布时间】：2011-08-29 06:42:03
【问题描述】：

我有一个 php 页面，其中包含另一个名为“tree.php”的 php 页面，还包含一个 iframe。iframe 调用页面“contentpage.php”。然后我想使用 javascript 或 jquery 从tree.php.我已经尝试过这些

document.getElementById['contentframe'].src = "contentpage.php";
$("#contentframe").attr("src", "contentpage.php");

【问题讨论】：

document.getElementById['contentframe'].src 应该是 document.getElementById('contentframe').src
顶级页面和iframe的域一样吗？如果不是，我预计您将无法更改 iframe 的来源。

标签： javascript jquery

【解决方案1】：

假设所有帧都在同一个域中，这很容易做到。

<html>
<head>
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript">
         var change_iframe_src = function(new_src) {
             $("#myframe-content").attr('src', new_src);
         }
    </script>
</head>

<body>
    <!-- frame which includes your tree.php -->
    <iframe src="iframe.html" width="200" height="200" border="1"></iframe>
    <!-- frame for which we will change src attribute -->
    <iframe id="myframe-content" src="" width="400" height="200" border="1"></iframe>        
</body>

现在在 tree.php 中为 something 附加一个单击处理程序，该处理程序应该更改 iframe 属性的 src（可能是一些链接）。示例：

<html>
<head>
    <title>Tree</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#nav a").click(function(e) {
                e.preventDefault();
                // call function in a parent frame
                parent.window.change_iframe_src(this.rel);
            })
        })
    </script>
</head>
<body>
    <div id="nav">
        <a href="#" rel="iframe2.html">Change iframe src to iframe2.html</a>
        <a href="#" rel="iframe3.html">Change iframe src to iframe3.html</a>
    </div>
</body>

现在通过这种设置，tree.php 中的链接将调用父窗口（嵌入 tree.php 本身的窗口）中定义的函数。该函数（在此示例中为 change_iframe_src）采用一个参数，该参数是框架 myframe-content 的 src 属性应更改为的新 url。

同样，只要基本文档和带有 tree.php 的 iframe 是同一域中的文档，这将有效。

【讨论】：