更新

Question

我目前有一个指向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>

Answer 1

如果您想在框架中打开所有链接，那么您应该在文档HEAD部分中说明这一事实

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

我认为这就足够了。

更新

好的，这是另一种方式。

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

.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>

更新II

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

Answer 2

类似这样的事情

<select id='selectLinks'>
    <option value='http://pncw0787:24543/SoA/Team%20Folders/NOC/noc%20tool%20html%20pages/CS1000%20Name%20Change.htm'>CS1000 Name Change</option>
    <option value='http://www.officedepot.com'>Go to Office Depot.com</option>
</select>

然后你需要一些javascript来控制它。我推荐jQuery库，因为它使这很简单。

编辑：更新了我的示例，实际上是正确的。还发现谷歌不喜欢在iframe中打开，所以看起来它不起作用，但它只是谷歌是痛苦的

<script type='text/javascript'>
    $(document).ready(function(){
        $("#selectLink").on("change", function(){
            var link = $(this).find("option:selected").val();
            $("#iframe1").attr("src", link);
         });                        

     });
 </script>

这是我的头脑，我一直在喝这可能不是确切的

由于

Answer 3

绅士，谢谢你的帮助。我能够使用以下内容。我只需要更改javascript以满足我的需求。非常感谢你!!

    <script language="javascript" type="text/javascript">
function jump(form) {
var myindex=form.menu.selectedIndex
if (form.menu.options[myindex].value != "0") 
{
window.open(form.menu.options[myindex].value, 
target="iframe1");
}
}
//-->
</script>

<form name="lissamenu2" ACTION=URI>
<select name="menu" onchange="jump(this.form)">
<option value="0">Select</option>   
<option value="0"></option>   (this adds a space).
<option value="http://pncw0787:24543/SoA/Team%20Folders/NOC/noc%20tool%20html%20pages/CS1000%20Name%20Change.htm">CS1000 Name Change</option>
</select>
</form>

在Iframe中打开的下拉选项

3 个答案:

更新

更新II