2013-03-25 3 views
0

У меня есть два пролетов ссылки, которые пользователь может нажать, а когда пролет щелкнул его удалить класс и добавляет еще один класс по щелчку один:JQuery удалить и добавить пядь класс

enter image description here

HTML:

<span class="resCheck label label-success"> 
    <a data-method="get" class="resCheckLink" href="trafikskola?utf8=%E2%9C%93&amp;query=lund&  
    amp;sort=asc">Cheap prices</a> 
</span> 
<span class="resCheck label"> 
    <a class="resCheckLink" data-method="get" href="trafikskola?utf8=%E2%9C%93&query=lund& 
    sort=desc">Expensive prices</a> 
</span> 

JQuery:

$(function(){ 
   $('.resCheckLink').click(function(e){ 
       $('.resCheck.label').removeClass('label-success'); 
       $(this).parent().addClass('label-success') 
   }); 
}); 

Но это доцентная работа, она доцент добавляет и удаляет классы, как я могу это исправить?

+0

Непонятно, что вы просите, но я не думаю, что parent() - правильное решение. – isherwood

+0

было бы проще, если бы вы использовали toggleClass() вместо ручного добавления и удаления класса. – dinukadev

+0

У меня постоянно возникают проблемы с селектором .parent(), не делая того, что вы ожидаете от него. Попробуйте заменить параметр .parent() с .closest ('. ResCheck'). Я обнаружил, что ближайший селектор, как правило, делает то же самое, с добавленным бонусом, если вы настроите иерархию (что, если этот должен быть внутри другого по дороге?), он обычно все еще находит правильные элементы. – Sean

ответ

1

попробовать это

$(function(){ 
    $('.resCheckLink').click(function(e){ 
     $('.resCheck').removeClass('label-success'); 
     $(this).parent().addClass('label-success'); 
    }); 
}); 
+0

он сначала устанавливает класс на нажатом, а затем возвращается на первый. то же самое. – SHUMAcupcake

+0

@SHUMAcupcake это сработало для u.I обновил код, см. Один раз – PSR

+0

нет, он не возвращается к первому. доцентная работа – SHUMAcupcake

0

Попробуйте это.

$(function(){ 
    $('.resCheckLink').click(function(e){ 
     $('span.resCheck').removeClass('label-success'); 
     $(this).parent().addClass('label-success') 
    }); 
}); 
0

Это действительно работает, я полагаю, вы неправильно ставили элемент или что-то в этом роде? Я добавил return false, чтобы предотвратить работу канала.

jsFiddle

$(function(){ 
    $('.resCheckLink').click(function(e){ 
     $('.resCheck.label').removeClass('label-success'); 
     $(this).parent().addClass('label-success'); 
     return false; 
    }); 
}); 
+0

этой работы, но теперь мои ссылки работают доцент. – SHUMAcupcake

+0

Изменение, внесенное мной в код, состояло в том, чтобы «вернуть false», чтобы я мог его протестировать. Удаление этого и это точная часть кода в вашем вопросе. Это выглядит правильно для меня. –

+0

Извините, но ссылки dosent work ... – SHUMAcupcake

0

Попробуйте

$(function(){ 
    $('.resCheckLink').click(function(e){ 
     $('.resCheck').removeClass('label-success'); 
     $(this).parent().addClass('label-success') 
    }); 
}); 
1

Попробуйте это ...

$(function(){ 
    $('.resCheckLink').click(function(e){ 
     $('.resCheck').removeClass('label-success'); 
     $(this).parent().addClass('label-success'); 
    }); 
}); 

Working DEMO

0

Вы удаление и добавление же класса, так что вы не будете иметь возможность контролировать на самом деле,

$('.resCheck.label').removeClass('label-success'); 
    $(this).parent().addClass('label-success'); 

так Пожалуйста, создайте еще один класс с различным стилем, а затем попытаться, с ответом данного РОО выше.

, который будет делать :)

+1

Вы правы. – SHUMAcupcake

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