0

Em minhas páginas asp utilizo um include para chamar um arquivo que contém meu menu:

<!--#include file ="cabecalho.asp"-->

Arquivo com menu:

<!DOCTYPE HTML>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <link rel="shortcut icon" type="image/x-icon" href="img/fav-ico.gif" />
        <link rel="stylesheet" href="css/style.css">
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
    </head>
    <body>  
        <div class="container">
            <div id="topo">
                <div id="logo">
                    <img src="img/logo.png" alt="">
                </div>
                <ul class="nav nav-tabs">
                    <li><a href="index.asp">Apresentação</a></li>
                    <li><a href="membros.asp">Membros</a></li>
                    <li><a href="legislacao.asp">Legislação</a></li>
                    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Notícias<span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="noticias2016.asp">2016</a></li>
                            <li><a href="noticias2015.asp">2015</a></li>
                            <li><a href="noticias2014.asp">2014</a></li>
                            <li><a href="noticias2013.asp">2013</a></li> 
                            <li><a href="noticias2012.asp">2012</a></li> 
                            <li><a href="noticias2011.asp">2011</a></li> 
                            <li><a href="noticias2010.asp">2010 e anteriores</a></li> 
                        </ul>
                    </li>
                    <li><a href="acoes.asp">Ações</a></li>
                    <!--<li><a href="sugestoes.asp">Sugestões</a></li>-->
                    <li><a href="atas.asp">Atas</a></li>
                    <li><a href="apresentacoes.asp">Apresentações</a></li>
                    <li><a href="links.asp">Links</a></li>
                </ul>
            </div>

Como faço para inserir a class active apenas no menu acessado?

1 Resposta 1

1

Você pode adicionar esse JS no final dessa página que você está dando um include:

url = document.location.pathname.substr(document.location.pathname.lastIndexOf("/") + 1); // Pega o nome da página atual, ex: teste.html

el = document.querySelector("[href*='" + url + "']"); // procura o link que contenha a url
li = el.parentElement.classList.add("active"); // adiciona a classe no li
4
  • Funcionou! Muito obrigado!! 2/08/2016 às 18:42
  • Que bom, marque como resposta para outras pessoas que tiverem o mesmo problema que o seu! ;)
    – Laerte
    2/08/2016 às 18:45
  • como faço isso? rs 31/08/2016 às 20:34
  • Basta clicar no "✓" abaixo das setas de voto positivo/negativo.
    – Laerte
    31/08/2016 às 21:08

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .