html - 在 Iframe 中打开的下拉选项

标签 html iframe drop-down-menu

目前,我的 iframe 左侧有一个链接列表,有点像菜单。但是,我很快意识到这不是一个非常可扩展的选项。我想要做的是创建一个简单的下拉菜单,其中包含我的所有链接,并让它们仍然在我的 iframe 中打开。

我的其中一个链接的示例。

<li>
  <a href="http://pncw0787:24543/SoA/Team%20Folders/NOC/noc%20tool%20html%20pages/CS1000%20Name%20Change.htm"
    target="iframe1">CS1000 Name Change</a>
</li>

最佳答案

如果你想在你的框架中打开ALL链接,那么你应该在你的文档的HEAD部分说明这个事实

<head>
  <base target="iframe1">
</head>

我认为这就足够了。

更新

好的,这是另一种方式。

首先是你的链接样式,我只是使用了这些样式,但毫无疑问你有自己的样式。

.menulink
{ 
  color: #0000FF;
  cursor: pointer;
}

.menulink:hover
{ 
  color: #FF0000;
  cursor: pointer;
}

接下来是在 IFrame 中打开链接的代码

<script type="text/vbscript" id="OpenInMyFrame">
  ' <!--
  Function OpenInMyFrame(LinkUrl)
    window.document.getElementById("MyFrame1").src = LinkUrl
  End Function
  ' -->
</script>

最后是您的链接和 iFrame

<ul id="MyMenu">
  <li class="menulink" onclick="OpenInMyFrame('http://www.bbc.co.uk')">Menu1</li>
  <li class="menulink" onclick="OpenInMyFrame('http://www.google.co.uk')">Menu2</li>
  <li class="menulink" onclick="OpenInMyFrame('http://www.microsoft.co.uk')">Menu3</li>
  <li class="menulink" onclick="OpenInMyFrame('http://www.ibm.co.uk')">Menu4</li>
</ul>
<iframe id="MyFrame1" name="MyFrame1" style="width: 1040px; height: 682px" src="Default.aspx">

</iframe>




<select id="MyMenu">
  <option class="menulink" onclick="OpenInMyFrame('http://www.bbc.co.uk')">Menu1</option>
  <option class="menulink" onclick="OpenInMyFrame('http://www.google.co.uk')">Menu2</option>
  <option class="menulink" onclick="OpenInMyFrame('http://www.microsoft.co.uk')">Menu3</option>
  <option class="menulink" onclick="OpenInMyFrame('http://www.ibm.co.uk')">Menu4</option>
</select>

更新二

<script type="text/javascript">
  //<!--
  function OpenInMyFrame(var1)
  {
    window.document.getElementById("MyFrame1").src = var1;
  }
  //-->
</script>

关于html - 在 Iframe 中打开的下拉选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16158473/

相关文章:

javascript - jQuery slider 适用于除 Chrome 15 以外的所有浏览器。在调整 Chrome 15 浏览器窗口大小时再次起作用

php - 当我返回页面时,下拉菜单不会保持选中状态

html - 从 SVG 文件中提取路径坐标

javascript - IE 中的动态 CSS 加载不起作用

dynamic - LightSwitch 动态级联下拉列表

php mysql 数组中的上一个下一个按钮

javascript - Div 覆盖在 IFrame 上

javascript - iframe 404错误

javascript - 在下拉列表中定义变量失败

javascript - 使用可点击的链接填充选择框