0

我正在使用 CSS/HTML 和 Javascript (Netscape 4.0) 创建一个假浏览器外壳，我想知道是否可以加载在 iframe 的文本框中键入的 URL。我在网上找到了一些东西，它将页面加载到同一目录中，但没有加载外部 URL。这是代码的那一部分：

<input type="submit" name="submit" id="submit" value="Go" onclick='document.getElementById("theframe").src=document.getElementById("url").value; return false;' />

这是 iframe 代码：

<iframe frameborder="0" class="iframe" id='theframe' style="width:100%; height:100%;" scrolling="yes"></iframe>
4

3 回答 3

0

在其最基本的...

<script type="text/javascript">
function loadUrl() {
    document.getElementById("urlDisplay").src = document.getElementById("urlSource").value;
}
</script>

<p><input type="text" id="urlSource" value="http://www.cnn.com"> <input type="button" value="Go" onclick="loadUrl()">

<p><iframe id="urlDisplay" width="200" height="200">
于 2013-10-16T01:32:24.243 回答
0

在我回答您的问题之前，请注意有些网站拒绝在 iframe 内加载页面（例如： http: //google.com），而有些网站会强制在 iframe 之外加载页面（例如：http://www .tumblr.com）。是的，我知道，这很糟糕。

好的，这是我对解决您的问题的看法：

<form action="" method="post" id="url-setter">
    <input type="text" name="url" id="url" />
    <button type="submit" name="submit">Change URL</button>
</form>
<iframe id="the-frame" width="640" height="480" src=""></iframe>
<script type="text/javascript">
    (function () {
        "use strict";
        var url_setter = document.getElementById('url-setter'), url = document.getElementById('url'), the_iframe = document.getElementById('the-frame');
        url_setter.onsubmit = function (event) {
            event.preventDefault();
            the_iframe.src = url.value;
        };
    }());
</script>
于 2013-10-16T08:19:05.907 回答
0

我发现到目前为止，这个在我的测试中效果更好。我目前正在为学生制作一个网站覆盖（它是他们想要使用 iframe 的网站上的一个作业 iframe）：

<script type="text/javascript">
function loadUrl() {
    document.getElementById("urlDisplay").src = document.getElementById("urlSource").value;
}
</script>

- 但到目前为止，我要添加的唯一功能是更改文本框大小的脚本，这样当你点击 go 时，iframe 就在文本框上方。

-这里是站点封面演示的链接https://retrowo1f.itch.io/coversite（没有添加图形和错误的布局请注意这些不是我将在演示中修复的错误，因为这就是演示的原因）

于 2021-03-26T18:46:12.320 回答