addClass к изображению при нажатии. Если щелкнуть другое изображение, удалите этот класс и добавьте его в новое изображение.

Question

У меня есть список, содержащий четыре изображения.Каждое изображение должно иметь только один активный класс в любой момент времени.(аналогично переключателям).

Мой код до сих пор поддерживает это нормально: http://jsfiddle.net/tctc91/HyHgp/

var themeChooser = $('.themeChooser ul li img');
themeChooser.click(function() {
    if(!themeChooser.hasClass('themeSelected')) {
        $(this).addClass('themeSelected');        
    } else {
        $(this).removeClass('themeSelected');
    }
});

Моя проблема в том, что когда класс .themeSelected уже активен, он не будет работатьесли вы нажмете на другое изображение.Мне это нужно, так что если он уже активен, и вы нажимаете на другое изображение, он удаляет существующий класс и добавляет его к новому изображению.

Спасибо!

Answer 1

Простое добавление $('.themeSelected').removeClass('themeSelected'); в ваш обработчик кликов дает то, что вы хотите.

Живой пример: http://jsfiddle.net/sT9jE/

---

Редактировать : Не совсемтак просто, выше останавливает повторный щелчок на выбранном элементе, не выбирая.Поэтому вам действительно нужно это дополнение:

if(!$(this).hasClass('themeSelected'))
    $('.themeSelected').removeClass('themeSelected');

См. Этот пример в реальном времени: http://jsfiddle.net/HM5DF/