jQuery - удаляет класс из любой <li>, которая не была просто нажата

Question

Допустим, у меня есть такой список ...

<ul>
  <li class="one">One</li>
  <li class="two">Two</li>
  <li class="three">Three</li>
</ul>

... и я хочу иметь возможность переключать класс в li ...

$( "li" ).click(function() {
    $( "li" ).toggleClass( "active" );
});

.. также я хочу, чтобы li кроме тех, которые были нажаты, никогда не показывались как '.active' при сохранении способности toggleClass в '.active' li

Так что я подумал, может быть, я хочу удалить Class из любого другого li, кроме того, который был нажат. Я не знаю, как я мог это сделать, хотя ...

Есть идеи, как этого добиться? Я уверен, что это довольно просто, но я понятия не имею, поскольку я очень плохо знаком с jQuery

Решено - Если кто-то хочет это увидеть ... мы идем: http://jsfiddle.net/6jm2s/17/ также этот ... http://jsfiddle.net/6jm2s/18/

Оба ответа работают отлично .. @jondavidjohn & @hunter Спасибо, ребята ... Жаль, что я не могу поставить галочку на оба ответа ... но я позволю охотнику получить его, так как его код короче. .:)

Answer 1

Сделайте так, чтобы, когда что-то было активным, оно всегда было активным:

$("li:not(.active)").live("click", function() {
    $(this).addClass("active");
    $(this).siblings().removeClass("active");
});

фокусируется только на li, которые еще не активны.*

---

Для возможности деактивации:

$("li").click(function() {
    $(this).toggleClass("active");
    $(this).siblings().removeClass("active");
});

рабочий пример: http://jsfiddle.net/6jm2s/18/

Answer 2

$( "li" ).click( function() {
    if( $(this).is('.active') ) {
        $(this).removeClass( "active" );
    }
    else {
        $( "li.active" ).removeClass( "active" );
        $(this).addClass( "active" );
    }
});