2012-02-27 6 views
1

Я ищу функцию для применения класса ко всем ссылкам, кроме одного щелчка.jquery выберите все ссылки, кроме тех, которые имеют определенный класс

CSS

.foot_active { 
    text-decoration:underline; 
} 
.foot_inactive { 
    text-decoration:none; 
} 

HTML

<div class="sitemap"> 
    <table class="table_site"> 
     <tr> 
      <td class="subsite"><a>op1</a></td> 
      <td class="subsite"><a>op2</a></td> 
      <td class="subsite"><a>op3</a></td> 
     </tr> 
    </table> 
</div> 

сценарий

$('a:contains("op1")') 
    .live('click', function(){ 
     $(this).addClass('foot_active'); 
     $('a:not(.foot_active)').addClass('foot_inactive'); 
    }); 
$('a:contains("op2")') 
    .live('click', function(){ 
     $(this).addClass('foot_active'); 
     $('a:not(.foot_active)').addClass('foot_inactive'); 
    }); 
$('a:contains("op3")') 
    .live('click', function(){ 
     $(this).addClass('foot_active'); 
     $('a:not(.foot_active)').addClass('foot_inactive'); 
    }); 

Этот скрипт работает только в первый раз, когда вы щелкните по ссылке, но не для будущих кликов. Я думаю, что я делаю что-то неправильно, но мой мозг кажется таким сумасшедшим сейчас.

спасибо.

ответ

1

для всех ссылок внутри тд с классом под названием .sitemap вы могли бы попробовать:

$('.sitemap a') .live('click', function(){ 
    $(this).addClass('foot_active'); 
    $('.sitemap a').not(this).removeClass('foot_active'); 
}); 
0

Вы можете попробовать ...

$('a.foot_active').removeClass('foot_active').addClass('foot_inactive'); $(this).removeClass('foot_inactive').addClass('foot_active');

... ли это делать то, что вы хотите?

2

Вы никогда не удаляете какие-либо классы, поэтому вы получаете все ссылки, имеющие неактивный класс.

Вам вообще не нужен неактивный класс, просто удалите активный класс. Это позволит заменить три обработчика событий:

$('a') .live('click', function(){ 
    $(this).addClass('foot_active'); 
    $('a').not(this).removeClass('foot_active'); 
}); 

Вы можете использовать более конкретные selctor чем 'a', как '.subsite a' если у вас есть какие-либо другие ссылки на этой странице.

0

Вы не хотите менять все остальные элементы. Элемент может иметь много классов, поэтому вы хотите только активировать активный класс.

$('.table_site a').addClass('foot_inactive').click(function(){ 
    $('.foot_active').removeClass('foot_active'); 
    $(this).addClass('foot_active');  
}) 
1

Во-первых, вы не должны использовать .live() как это рекомендуется в JQuery 1.7.

Вот что вы ищете, я надеюсь.

$('.sitemap a').click(function(){ 
    $('.sitemap a').toggleClass('foot_inactive',true).toggleClass('foot_active',false); 
  $(this).addClass('foot_active');     
}); 
Смежные вопросы