左边导航切换时右边的内容会显示会出错。不知道那里错了,望指点!!先谢谢了~
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <title> new document </title>
  <meta name="generator" content="editplus">
  <meta name="author" content="">
  <meta name="keywords" content="">
  <meta name="description" content="">
 </head>
 
 <style type="text/css">
 body { margin: 10px; padding: 0px; }
 #nav { width: 200px; float: left; display: block;background:;}
 #main iframe {
  float: left; 
  position:fixed;
  width:800px;
  height:500px;
padding:0;
margin:0;
 
 }
 </style>
 
 <script type="text/javascript">
 window.onload = function()
 {
 var anchor = document.getElementsByTagName('a');
 var ifr = document.getElementById('ifr');
 for (var i=0;i<anchor.length;i++ )
 {
  anchor[i].onclick = function()
  {
      ifr.src = this.href;
   this.href = '#';
  }
 }
 }
 </script> <body>
  <div id="wrapper">
 <div id="nav">
  <ul>
   <li><a href="http://www.baidu.com">Baidu</a></li>
   <li><a href="http://www.google.com.hk">Google</a></li>
   <li><a href="http://www.sina.com.cn">Sina</a></li>
  </ul>
 </div>
 <div id="main">
 <iframe id="ifr" frameborder="1px" src="http://www.baidu.com">
 </div>
  </div>
 </body> 
</html>

解决方案 »

  1.   

    我这里没出错啊估计是google被墙了 出错
    你换别的网址看看
      

  2.   

    没有出错,可以用
    window.onload = function()
     {
     var anchor = document.getElementsByTagName('a');
     var ifr = document.getElementById('ifr');
     for (var i=0;i<anchor.length;i++ )
     {
      anchor[i].target = "main";
      anchor[i].onclick = function()
      {
      ifr.src = this.href;
      this.href = '#';
      }
     }
     }<iframe id="ifr" name="main" frameborder="1px" src="http://www.baidu.com">
    这样更好
      

  3.   

    anchor[i].onclick = function()
      {
      ifr.src = this.href;
      this.href = '#'; // 这儿不对
      }
     }你这样,下次再点击,就获取不到原来的url了anchor[i].onclick = function()
      {
      ifr.src = this.href;
      return false; // 这样页面不跳转
      }
     }
      

  4.   

    我的实现方法是在<a>标签中自定义一个属性,在JS加载时读取此属性.虽然与你原来的代码有所差距,但能实现你要的功能.呵呵.....
    调整内容见红色字体
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
      <title> new document </title>
      <meta name="generator" content="editplus">
      <meta name="author" content="">
      <meta name="keywords" content="">
      <meta name="description" content="">
     </head>
      
     <style type="text/css">
     body { margin: 10px; padding: 0px; }
     #nav { width: 200px; float: left; display: block;background:;}
     #main iframe {
      float: left;  
      position:fixed;
      width:800px;
      height:500px;
    padding:0;
    margin:0;
      
     }
     </style>
      
     <script type="text/javascript">
     window.onload = function()
     {
     var anchor = document.getElementsByTagName('a');
     var ifr = document.getElementById('ifr');
     for (var i=0;i<anchor.length;i++ )
     {
      anchor[i].onclick = function()
      {
      ifr.src = this.getAttribute("shref");
      this.href = '#';
      }
     }
     }
     </script> <body>
      <div id="wrapper">
     <div id="nav">
      <ul>
      <li><a shref="http://www.baidu.com">Baidu</a></li>
      <li><a shref="http://www.google.com.hk">Google</a></li>
      <li><a shref="http://www.sina.com.cn">Sina</a></li>
      </ul>
     </div>
     <div id="main">
     <iframe id="ifr" frameborder="1px" src="http://www.baidu.com">
     </div>
      </div>
     </body>  
    </html>