Question

header.html中

  <div>
     <a href="#" id="reports">reports</a>
     <a href="#" id="summary">reports</a>
  </div>

detailpage.html

  <object src="header.html">
  </object>
  <section>
     <div class="abc"></div>
     <div class="123"></div>
  </section>

header.html已导入detailpage.html，点击header.html div中的报告标签，应显示类abc，并点击摘要标签应显示header.html个等级123的div。

Answer 1

您可以直接在header.html中的两个div上收听点击事件，然后显示另外两个div：

//Hide them if necessary
//$(".abc").hide();
//$(".123").hide();

$("#reports").click(function(){
  $(".abc").show();
});

$("#summary").click(function(){
  $(".123").show();
});

这里有JSFiddle来演示代码。

Answer 2

 $(function(){
    $('#reports').click(function(){
        if($('.abc').is(':visible'))
           $('.abc').hide();
        else
          $('.abc').show();
     });

    $('#summary').click(function(){
       if($('.123').is(':visible'))
         $('.123').hide();
       else
         $('.123').show();
    });

});

注意：您可以在页面加载时隐藏您的div

如何在一个页面上引用另一个页面中的事件？

2 个答案: