如何在不重新加载页面的情况下更改帧源

Question

我正在创建一个模板站点,我想根据在javascript中点击的链接更改IFrame的内容,但我得到的错误是如果我更改iframe的'src'属性页面重新加载.

所以我的问题是

如何在不重新加载页面的情况下更改iframe内容？下面是我的代码

// HTML部分

<li class="inside first">
   <a href='JavaScript:void(0);' onclick='clicked(0);' title="HOME">HOME</a>
</li>
<li class="inside">
   <a  href=''onclick='clicked(1); ' title="PRODUCTS">PRODUCTS</a>
</li>
<li class="inside">
   <a  href='' onclick='clicked(2); ' title="SOLUTIONS">SOLUTIONS</a>
</li>
<li class="inside">
    <a  href=''  onclick='clicked(3); 'title="SERVICES">SERVICES</a>
</li>
<li class="inside">
    <a  href='' onclick='clicked(4); ' title="SUPPORT">SUPPORT</a>
</li>

<div id="mainContent">
    <iframe 
           src=''
           width="100%"
           height="100%"
           name='content'
           id='content'>&nbsp;
    </iframe>
</div>

// Javascript部分

<script type="text/javascript">
   var index=0;
   var link_list= new Array('homepage.html','product.html','solution.html',
            'services.html','support.html','event.html',
             'partner.html','company.html');

   var frame=document.getElementById('content');

   frame.src=link_list[index];

   function clicked(key)
   {

       // The following line is redirecting the page
       frame.src=link_list[key];
       return false;
   }
   </script>

Answer 1

只需为这些链接编写hrefs并添加属性target="content".

这可以完全没有javascript.