Как удалить класс CSS из одного якоря и назначить его другому с помощью jquery? - PullRequest
Новая
       47

Как удалить класс CSS из одного якоря и назначить его другому с помощью jquery?

3 голосов
/ 30 марта 2010

Вот мои якоря, 

<a ID="lnkbtn0" class="page-numbers" href="#">1</a>
<a ID="lnkbtn1" class="page-numbers" href="#">2</a>
<a ID="lnkbtn2" class="page-numbers" href="#">3</a>
<a ID="lnkbtn3" class="page-numbers" href="#">4</a>

И моя функция щелчка я добавляю cssclass, чтобы показать, что это текущий якорь 

$("a.page-numbers").click(function() {
                $(this).addClass('page-numbers current');
    });

Что происходит, когда я нажимаюследующий якорь тот же класс был добавлен к текущему и предыдущему якорю ... Что можно сделать, чтобы удалить cssclass page-numbers current и назначить cssclass page-numbers предыдущему / всем остальным якорям без изменения текущего ....

Ответы [ 7 ]

6 голосов
/ 30 марта 2010

Чтобы избежать дорогостоящего пробега через весь дом, сделайте следующее: 

$("a.page-numbers").click(function() {
    $(this).addClass('current').siblings().removeClass('current');
});
1 голос
/ 30 марта 2010 
$("a.page-numbers").click(function() {
                $(this).addClass('current').siblings('a').removeClass('current');
    });

также возможно, даже если на самом деле это не нравится.

1 голос
/ 30 марта 2010 
$("a.page-numbers").click(function() {
    $("a.page-numbers.current").removeClass("current");
    $(this).addClass('current');
});
1 голос
/ 30 марта 2010

Чтобы ответить на @ 1001 * ответ @ Danrumb's :

Простым решением было бы удалить класс current для всех (одного) a.page-numbers, а затем добавить его к выбранному: 

$('a.page-numbers').click(function() {
    $('a.page-numbers').removeClass('current');
    $(this).addClass('current');
});
0 голосов
/ 30 марта 2010 
<a ID="lnkbtn0" class="page-numbers" href="#">1</a>
<a ID="lnkbtn1" class="page-numbers" href="#">2</a>
<a ID="lnkbtn2" class="page-numbers" href="#">3</a>
<a ID="lnkbtn3" class="page-numbers" href="#">4</a>

$("a.page-numbers").click(function() {
    $('a.page-numbers.current').removeClass('current');
    $(this).addClass('current');
});

Вам не нужно продолжать добавлять page-numbers, так как он уже был добавлен.

0 голосов
/ 30 марта 2010

Возможно что-то вроде этого: 

   $("a.page-numbers").click(function() {
                    $(this).addClass('current').prev('a').removeClass('current');
        });

Предполагается, что предыдущий элемент имеет текущий класс.

Еще лучше было бы сделать два этапа, когда вы нажимаете:

1) перебрать все якорные теги и удалить текущий класс из всех 2) установить текущий элемент для класса current.

Это означает, что вы можете нажать на любую из них, и она должна работать

0 голосов
/ 30 марта 2010

«класс» page-numbers class - это фактически 2 класса: page-numbers и current.

Чтобы добавить класс, вам просто нужно 

$(this).addClass('page-numbers');

Чтобы удалить класс current, вы должны использовать: 

$(this).removeClass('current');

См. документы для получения дополнительной информации.

...