Недавно я задал другой вопрос о переключении классов. Сначала я думал, что есть решение, но похоже, что у меня все еще есть проблемы. Я пытаюсь создать небольшой сайт, который показывает неудачи и успехи для некоторых предметов. Вот пример того, что я пытаюсь построить: http://jsfiddle.net/zrYLh/4/Переключение условного класса
Как сайт должен работать: Если я проверяю ящик для компьютера A, компьютеры A, B, C & D должна покраснеть. Если я тогда поставлю флажок для компьютера B, ничего не изменится. Если я сниму флажок для компьютера B, все элементы должны по-прежнему оставаться красными, потому что компьютер A по-прежнему проверяется, и он должен быть красным для A, B, C и D на своем собственном. Такая же логика должна выполняться для любой комбинации проверок.
В настоящее время код заставляет определенные элементы переключаться обратно на зеленый, даже если другой предмет требует, чтобы они оставались красными. Например, когда A и B проверяются, а затем B не отмечен, он заставляет A и C идти зеленым.
Вот мой сценарий, как сейчас:
$('#computerA').click(function(){
var state = this.checked;
$('#computerA2, #computerB2, #computerC2, #computerD2').toggleClass('green', !state).toggleClass('failure', state);
})
$('#computerB, #computerC, #computerD').click(function(){
var state = this.checked || $('#computerA').is(':checked');
$(this).prev().toggleClass('green', !state).toggleClass('failure', state);
})
$('#computerB').click(function(){
var state = this.checked;
$('#computerA2, #computerC2').toggleClass('green', !state).toggleClass('failure', state);
})
$('#computerA, #computerC').click(function(){
var state = this.checked || $('#computerB').is(':checked');
$(this).prev().toggleClass('green', !state).toggleClass('failure', state);
})
Любая помощь будет принята с благодарностью - спасибо!