如何使用 jQuery 重新加载 iframe答案

【问题标题】：How To Reload A iframe Using jQuery如何使用 jQuery 重新加载 iframe
【发布时间】：2010-09-07 08:09:15
【问题描述】：

我使用 iframe 在浏览器窗口中创建了一个基本浏览器：

目的是允许使用 jquery 对元素进行鼠标悬停样式，即/突出显示所有红色链接等...更改字体等..

我创建了两个文件：

browser.php

<html>
    <head>
        <title></title>

        <style>

        #netframe {
            float:right; 
            height: 100%; 
            width: 80%;
        }

        #sidebar {
            float:left; 
            height: 100%; 
            width: 20%;
        }

        </style>



    </head>
    <body>


    <div id="container">

        <div id="sidebar">

    Enter A URL:
            <input type="text" name="url" id="url">
            <input type="button" value="load" id="load">

            <br><br>    


        </div>

        <div id="netframe">
            <iframe height="100%" width="100%" class="netframe" src="pullsite.php" id="main_frame"></iframe>
        </div>

    </div>


    </body>
</html>

还有pullsite.php

<html>

<head>

    <title></title>

    <link href="css/reset.css" rel="stylesheet" type="text/css">

    <style>
        .highlight { 
            outline-color: -moz-use-text-color !important;
            outline-style: dashed !important;
            outline-width: 2px !important;
        }
    </style>    

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>



</head>

    <body>

    <div id="contents">           

    <?php echo file_get_contents('http://www.google.com/webhp?hl=en&tab=iw'); ?>

    </div>

        <script>

        $("#contents").contents().find("a").addClass("highlight");

        </script>


    </body>


</html>

谁能帮助我可以使用的 jquery 代码允许用户在输入字段中输入新的 url 并重新加载 iframe。

谢谢！！！

【问题讨论】：

标签： jquery html iframe

【解决方案1】：

一种 HTML：

<input type="text" name="url" id="url"/>
<input type="submit" name="go" id="go" value="Go!"/>
<iframe id="miniBrowser"></iframe>

jQuery:

$('#go').on('click', function() {
  $('#miniBrowser').attr('src', $('#url').val());
});

【讨论】：

抱歉，这个解决方案似乎不起作用——至少在 FireFox 3.5.11 中不起作用——还有其他想法吗？！
别管现在都在工作！没有先在页面上正确加载 jquery... 代码运行良好 - 感谢您的帮助！！！！

【解决方案2】：

我不是 100% 确定，但请尝试

$('#main_frame').attr('src','http://www.google.co.uk');

我目前无法对此进行测试，但更改 iframe 上的 src 属性应该会导致基于新值的重新加载。

这可以通过使用文本框中的 url 来实现

$('#load').click(function(){
    $('#main_frame').attr('src',$('#url').val());
});

【讨论】：

我的回答中的假设相同，这也是我在 Google 上找到的。