Переключать классы на div, когда проверяются разные радио

Question

Переключать классы на div, когда проверяются разные радио

0

Застрял на том, что кажется простой задачей, и попробовал несколько вариантов без успеха. У меня есть таблица, в которой есть некоторые радиостанции в тегах. Каждая радиосвязь объединяется с группой данных, которая находится в одном столбце. Когда я нажимаю на радиостанции, я хочу добавить/удалить класс или toggleClass, чтобы каждый столбец был выделен, когда пользователь выбирает разные параметры.

Создал образец скрипки того, что я пытаюсь сделать здесь:

JS FIDDLE

 <form id="myForm">
 <table>
<tr>
<th class="highlightMe option"> <input type="radio" name="radioName" value="1" checked="checked" class="option"/>one 
 </th>
 <th class="noClass option"><input type="radio" name="radioName" value="2" class="option"/>two 
 </th>
  <th class="noClass option"><input type="radio" name="radioName" value="3" class="option"/>three 
  </th>
  </tr>
  <tr>
   <td class="highlightMe">Highlight Me</td>
   <td class="noClass option">Or Highlight Me</td>
   <td class="noClass option">Or highlight three</td>
   </tr>
   </table>
   </form>

Простой класс с фоном для выделения всех столбцов данных таблицы:

.highlightMe {
background:#D32F32;
}

Один из неудачных сценариев, которые я пробовал:

  $('.option').each(function() {
var $this = $(this);
if($this.attr('checked')) {
    $this.addClass('highlightMe');
 } else {
    $this.removeClass('highlightMe');
 }
});

isaac weathers 26 апр. 2014, в 06:52

Источник

Теги:

jquery

checked

radio

toggleclass

addclass

1 ответ

Ещё вопросы

Arun P Johny · Accepted Answer · 2014-04-26T02-34-00.000Z

Пытаться

jQuery(function($) {
    $('.option').change(function() {
        var $this = $(this), $td = $this.parent(), $tr=$td.parent();

        $tr.next().add($tr).find('.highlightMe').removeClass('highlightMe');

        if(this.checked) {
            $tr.next().find('td').eq($td.index()).add($td).addClass('highlightMe')
        }
    });
});

Демо: скрипка

YAHTZEE !!! Я даже не был близко. Спасибо (снова) Арун! Помечен ваш ответ как правильный.