javascript - 如何在点击链接时创建 iframe？

Question

我有一个网页，表格内有多个链接。其中一个链接位于 td 标记内。我想要一种调用 iframe 的方法，一旦用户单击链接，该 iframe 就会打开。当 iframe 弹出时，页面的其余部分将变得无响应，一旦用户退出 iframe，外部页面就会变得响应。表 td 是这样的:

<td >
<a href="configuration.xml related jsp action">Set the Iframe up</a>
</td>

iframe 将由另一个 jsp 的内容填充。

编辑:我很匆忙，所以忘记粘贴我尝试过的代码:所以这里是:

<td >
<a href="#">Set the Iframe up</a>
<div id="modalMan" style="display:none;">
<div class="modalsub" >
<p class="close"><a href="#"><img src="cbutton.gif" alt="Close"/></a></p>
<iframe id="myFrame" style="display:none;" height="430" width="675" 
src="myJSP.jsp" >
</iframe>
</div>
</div>
</td>

然而，这会产生一个问题，因为关闭图标不会出现，而 div 的部分即

   <div id ="modalman">
   <p class>
   <iframe src>

所有内容都保持隐藏，iframe 以类似的外观打开，但功能全部困惑，myjsp 的 javascript 内容保持隐藏。

再次编辑:非常抱歉，我忘记提及我已经尝试过 onclick 功能，但由于我的 href 是这样的，所以它会直接在新的浏览器选项卡中打开 jsp在 iframe 中打开它。

 <a href="configuration.xml related jsp action">Set the Iframe up</a>

我怎样才能实现这个目标？请建议一种方法。

Answer 1

这是一个可以做到这一点的非常基本的 JavaScript 函数。函数参数是您希望 iFrame 附加到的元素以及您希望它指向的位置。

HTML

<a href="#" onclick="setIframe(this,'http://www.stackoverflow.co.uk')" >Set the Iframe up</a>

JavaScript

function setIframe(element,location){
    var theIframe = document.createElement("iframe");
    theIframe.src = location;
   element.appendChild(theIframe);
}