Как активировать ссылку на jquery?

Вот мой код навигации, я пытаюсь активировать его с помощью jquery. Но мне нужно небольшое решение.Как активировать ссылку на jquery?

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
      <ul class="nav navbar-nav side-nav"> 
       <li class="active" id="dashboard"> 
       <a href="admin/users/dashboard">Dashboard</a>      
       </li> 
       <li id="clients"> 
       <a href="admin/users/clients">Clients</a>      
       </li> 
      </ul> 
</nav>

Я могу активировать активную ссылку, используя onclick event. На странице Если я прав

$('#deshboard').click(function(){ 
    $(this).addClass('active'); 
})

Это работает, но нужно написать много кода. Есть ли какое-нибудь легкое решение?

источник

2015-10-30 Satu Sultana

Таким образом, после добавления этого 'active' класс, он будет перемещаться в другая страница, что означает, что вы потеряете любые изменения на стороне клиента. Правильно? –

Если я перейду к другой странице, мне нужно снова написать активный код для активной страницы. Например, если я иду на страницу клиентов. Мне нужно вызывать $ ('# clients'). Click (function() {....... Мне нужно действительно небольшое решение, как если бы эта ссылка активна в url, тогда активируйте эту ссылку. –

Я имею в виду, если вы всегда возвращайте такой HTML-код, как вы показали, тогда у вас всегда будет 'dashboard' как' active'. Даже если вы примените такой скрипт, когда вы нажмете 'clients', он станет' активным' на секунду, затем страница перезагрузится, и 'dashboard' снова станет активным, пока вы находитесь на странице' clients'. Вам нужно установить его на стороне сервера. –

просто сделать следующее:

Просто используйте один класс для всех звеньев, например "common_class", а затем сделать следующее,

HTML

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
      <ul class="nav navbar-nav side-nav"> 
       <li class="active common_class"> 
       <a href="admin/users/dashboard">Dashboard</a>      
       </li> 
       <li class="common_class"> 
       <a href="admin/users/clients">Clients</a>      
       </li> 
      </ul> 
</nav>

Jquery

$('.common_class').click(function(){ 
    $('.common_class').removeClass('active'); // it remove all the active links 
    $(this).addClass('active'); // it adds active class to the current link you have opened 
})

это спасло бы много вашего кода, и это легко понять.

ПРИМЕЧАНИЕ. Добавьте этот jquery в файл заголовка, который должен быть одинаковым для всех страниц.

пойти с ним

источник

2015-10-30 05:49:08

@SatuSultana я согласен с ответом Insomania, умный и простой;) –

Это не работает после загрузки страницы. Я думаю, что это должно быть изменение базы URL. –

, вы должны использовать один и тот же заголовочный файл для обеих страниц, если заголовочный файл не создан, затем вызовите указанную выше функцию jquery для обоих файлов, –

Использовать общий класс в UL тег

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
        <ul class="nav navbar-nav side-nav common_class "> 
         <li class="active" id="dashboard"> 
         <a href="admin/users/dashboard">Dashboard</a>      
         </li> 
         <li id="clients"> 
         <a href="admin/users/clients">Clients</a>      
         </li> 
        </ul> 
     </nav>

И JS будет:

$('.common_class li').click(function(){ 
    $('.common_class li').removeClass('active'); 
    $(this).addClass('active'); 
})

источник

2015-10-30 05:55:09 Sachink

Как активировать ссылку на jquery?

ответ

Смежные вопросы