如何创建iframe内容的书签

时间:2013-12-07 13:23:08

标签: javascript php jquery html iframe

在这里我得到一个id为“about_ma”的列表元素和一个名称为“page”的iframe,它最初没有显示。

<div id="navigation">
          <ul id="nav">
      <li id="about_ma"><a href="index1.php?name=about.php">About Us</a></li>
      <li><a href="index1.php?name=director.php">Director Desk</a></li>
      </ul>
 </div>
 <iframe src="<?php echo $name;?>"style="display:none;"name="page" id="nav_content">
 </iframe>  

我使用以下php代码获取url中的名称

   <?php
   $name= $_GET['name'];
   echo "<br>";
   echo $name;
   ?>`

我正在使用的脚本是

 $(document).ready(function(){
    $('#about_ma').click(function(){
           $('#nav_content').fadeIn();
  });
  });

如果我的概念是正确的,那么根据我的说法,当我点击关于我们时,应该显示带有src about.php的iframe。整个编码在index1.php上完成。 所以任何人都可以告诉我这里的错误,因为我试过这个并且它不起作用。在此编码之前的主要目的是创建iframe内容的书签。如果我的概念是错误的,那么任何人都可以告诉我如何创建iframe内容的书签。因为当你刷新整个网页时,加载了带有默认src的iframe,由于这个原因,他的iframe内容的书签是不可能的。 请帮助我。

1 个答案:

答案 0 :(得分:1)

如果您希望在点击导航链接时更改src iframe,则需要使用attr()方法对其进行修改。为了能够添加书签,您需要使用哈希值。将哈希名称存储在链接的data-属性中。

HTML

<li id="about_ma"><a href="index1.php?name=about.php" data-hash="about">About Us</a></li>

JS

$('#navigation a').click(function(e){
       e.preventDefault();/* prevent browser opening link*/
       location.hash=$(this).data('hash');/* set hash of url*/
       var newSrc=$(this).attr('href');
       $('#nav_content').attr('src', newSrc).fadeIn(); 

    });

/* on page load*/

var hash=location.hash;
if(hash && hash !='#'){
  hash=hash.slice(1)
  $('#navigation a[data-hash='+hash+']').click()
}