Question

我有2个htm文件：a.htm和b.htm。在b.htm中我有2个div，其中一个是a.htm的链接，我想在第二个div中打开但它在新标签页中打开为新页面。我在javascript方面表现不佳，但我看了很多例子，所以我相信我非常接近解决方案，但显然在某处有一些错误。请帮忙！

所以，在a.htm中我有这个：

<html>
    <body>
        TEST
    </body>
</html>

在b.htm我有这个：

<html>
    <head>
        <script language="JavaScript">
            function url2div(url,target){
                document.getElementById(target).innerHTML = '<iframe style="width:100%;height:100%;" frameborder="0" src="' + url + '" />';
            }   
        </script>
    </head>
    <body>

        <div id="menu" style="background-color:#FFD700;height:100px;width:100px;float:left;">
            <a href="a.htm" onclick="url2div(this.href,'content')">Click</a>
        </div>

        <div id="content" style="background-color:#EEEEEE;height:100px;width:400px;float:left;">
            Original content
        </div>

    </body>
</html>

Answer 1

将链接存储在函数内，而不是href属性：

<a href="#" onclick="url2div('http://www.bing.com', this)">Click</a>

将JS更改为：

function url2div(url, element) {
    var iframe = document.createElement('iframe');
    iframe.setAttribute('src', url);
    element.appendChild(iframe);
}

<强> JSFiddle Demo #1

如果要在同一iframe中打开链接，请将链接存储在href以外的任何其他属性中。然后，使用您当前的功能，它应该工作正常！

<a href="#" id="a.htm" onclick="url2div(this.id,'content')">Click</a>

<强> JSFiddle Demo #2

Answer 2

我认为这并不像你做的那么复杂。此外，之前的答案并不是OP正在做的事情......所以这就是我的抨击：

首先，我假设是html5，所以你不需要＆＃34; javascript＆＃34;作为脚本标记的一部分。其次，我认为你不需要传递所有这些变量。您的锚标记应该引用

 <a href=b.htm#content onclick="url2div();"<\a>

，你的javascript应该是

  otherPageText = "<iframe src=\"HtmlPage2.html\" width=\"200\" height=\"200\"></iframe>";
  document.getElementById("content").innerHTML = otherPageText;

之后，如果您需要变量，请仔细尝试一次传递一个变量。

原始问题的一部分是你正在通过＆＃34;这个＆＃34;它引用了新页面，而不是旧页面，但是当您在新页面上发生并且没有将您想要的页面带回第一页时。我远离它的部分原因。

PS抱歉格式不正确。这对我来说都很新鲜......

javascript：<a href="" ...=""></a>中的目标div

2 个答案: