如何激活另一个html文件中的链接

How to activate link in another html file?

本文关键字:文件 html 链接 另一个 何激活 激活      更新时间:2023-09-26

使用这个线程,我将我的标题执行到单独的html文件

header.html:

<div class="navbar navbar-default navbar-fixed-top" id="top" role="banner">
  <div class="container">
    <div class="navbar-header">
      <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <div class="navbar-collapse collapse" role="navigation" style="height: auto;">
      <ul class="nav navbar-nav">
        <li><a href="/page1.html">Page1</a></li>
        <li><a href="/page2.html">Page2</a></li>
      </ul>
    </div>
  </div>
</div>

并将其包含在我的index.html中。

<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script> 
$(function(){
  $("#navbar-header").load("header.html"); 
  $("#footer").load("footer.html"); 
});
</script>

<div id="navbar-header"></div>

我的问题是,如何在选定的页面(page1和page2)上应用"活动"类?

<li class="active"><a href="/page1.html">Equator Server</a></li>

你可以通过在源元素(一个应该激活另一个html上的链接的元素)上添加一个Click事件监听器来调用目标元素上的jQuery Click()事件。

$('.icon-bar-1').on('click', function(){
  $('.page-1').click(function(){/* code to perform on targetted click listener */});
});

可以使用jQuery的。addclass(),在html中使用特定的类,例如

html文件添加菜单

<div class="class1" id="navbar-header"></div>

分隔文件头

$(document).ready(function () {
        if ($( "#navbar-header" ).hasClass( "class1" )) {
            $("#id-to-add").addClass("active");
        }
    });