Question

过去几个小时我一直在尝试更改iFrame的src。这似乎是一个简单的任务，但由于某种原因经过数百次尝试并在堆栈上阅读了其他一些问题和答案，我仍然发现自己无法更改iFrame的src。从下面的代码中可以看出，我已经尝试了很多次。我做错了什么？

    <body>

       <p><iframe src="http://localhost/ok.html" name="myFrame" width="500" marginwidth="0"     height="500" marginheight="0" align="middle" scrolling="auto"></iframe>


<script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    function loadPages(){
        var loc = "http://localhost/morningmarketweb/index.html";

        //var myIframe = document.getElementById("myFrame");

        //window.frames[myIframe].location = "http://localhost/morningmarketweb/index.html";

        // $(myIframe).load('http://localhost/morningmarketweb/index.html');

        // document.getElementId('myFrame').src="google.com";

       // var myIframe = document.getElementById('myFrame');
       // myIframe.src=loc;


        //$('#myFrame').attr('src', loc);

        document.getElementById('myFrame').setAttribute('src', loc);


    }
    </script>
    </body>

Answer 1

以下是代码：

<iframe src="http://jquery.com/" id="myFrame" width="500" marginwidth="0" height="500" marginheight="0" align="middle" scrolling="auto"></iframe>
<button onclick="loadPages()">Click Me</button>
<script>
    function loadPages(){
        var loc = "http://es.learnlayout.com/display.html";
        document.getElementById('myFrame').setAttribute('src', loc);
    }
</script>

正如您所看到的，第一个问题是您要求ID中的元素......好吧，那么您需要指定一个ID。第二个问题，你需要有一个触发动作的元素＆＃34; loadPages＆＃34; ...所以你可以为它设置一个按钮。

这也是功能性的例子：

http://jsfiddle.net/littapanda/Jsc4E/

Answer 2

名称不是Id。设置ID =＆＃34; myFrame＆＃34;这将有效：$（＆＃39; #myFrame＆＃39;）。attr（＆＃39; src＆＃39;，loc）;

Answer 3

<iframe src="http://localhost/ok.html" name="myFrame" width="500" marginwidth="0"     height="500" marginheight="0" align="middle" scrolling="auto" id="myFrame"></iframe>

<script>

document.getElementById('myFrame').src = "http://someurl.com";

</script>

//也基于您上面的代码，您在Iframe上没有ID - 所以我添加了id =＆＃39; myIframe＆＃39;

使用Javascript，JQuery，动态更改iFrame Src

3 个答案: