HTML+CSS+JavaScript

Есть вот такой HTML код...

<input name="s" type="radio" value="s1">s1 <input name="s" type="radio" value="s2">s2 <input name="s" type="radio" value="s3">s3 <br> <input name="r1" type="radio" value="r1">r1 <input name="r1" type="radio" value="r2">r2 <input name="r1" type="radio" value="r3">r3 <br> <input name="n1" type="radio" value="n1">n1 <input name="n1" type="radio" value="n2">n2 <input name="n1" type="radio" value="n3">n3

Подскажите как сделать так, чтобы когда выбираешь s1 дезактивировались ячейки с кнопками r1 и n1 или например когда выбираешь n3 дезактивировались ячейки с кнопками r3 и s3, но если убираешь отметку нижние radio кнопки активировались для нажатия вновь

document.getElementById('шв').checked=false;

>document.getElementById('шв').checked=false;
а можете более подробно?

<form onclick="f(this)"> ... <div id="rad"> <input name="s" type="radio" value="s1">s1 <input name="s" type="radio" value="s2">s2 <input name="s" type="radio" value="s3">s3 <br> <input name="r1" type="radio" value="r1">r1 <input name="r1" type="radio" value="r2">r2 <input name="r1" type="radio" value="r3">r3 <br> <input name="n1" type="radio" value="n1">n1 <input name="n1" type="radio" value="n2">n2 <input name="n1" type="radio" value="n3">n3 </div> ... </form> <script> function f (x) { for (var y = x.elements, z = [], w = [0, 0, 0], j = 0, k = -1; j < y.length; j++) if (y [j].type == 'radio' && y [j].parentNode.id == 'rad')    {z [++k] = y [j]; if (y [j].checked) w [k % 3] = 1} for (var j = 0; j < 3; j++) for (var i = 0; i < 7; i = i + 3) z [j + i].disabled = (!z [j + i].checked && w [j]) ? 1 : 0; } </script>

Можете прокомментировать написанное? а то непонятно :(

Вы сначала запустите приведенный мною код AS IS ("как он есть") и определитесь - по функциональности это то, что вам нужно, или не совсем то?
И сообщите здесь об этом.

А уж потом (если работа скрипта вас полностью устраивает) спрашивайте конкретно - что именно вам непонятно.

Попробовал все работает. На ту форму вопроса которая была дана изначально сделали все правильно.
Но можно ли еще добавить в этот скрипт возможность, что бы можно было поменять выбранное решение, а то здесь если расставил "точки" то изменить их уже нельзя, например обменом по вертикали т.е. если отмечено n1 и s3 то при нажатии на n3 значение бы s3 сместилось на s1.
HTML код - здесь все ясно,
<form onclick="f(this)"> - тоже понятно при нажатии активировать функцию f
function f (x) { ...} - эт тоже нонятно, объявление функции f,
а вот со всем остальным включая <div id="rad">, не понятно :(

>можно ли еще добавить в этот скрипт возможность, что бы можно было поменять выбранное решение
По логике поставленной задачи это может быть осуществлено ЕДИНСТВЕННЫМ способом - необходимо иметь в форме кнопку/ссылку, по нажатию на которую все отметки снимаются и все радиокнопки активируются.

><div id="rad">, не понятно
Контейнер <div id="rad"> применён ИСКЛЮЧИТЕЛЬНО из соображений, что в форме кроме 9-ти взаимосвязанных радиокнопок МОГУТ БЫТЬ и ещё какие-то радиокнопки, кои действуют самостоятельно. Скрипт по признаку вхождения в <div id="rad"> определяет именно эти 9-ть взаимосвязанных радиокнопок.
Можно было бы, например, не использовать <div id="rad">, а дать всем этим кнопкам одинаковое имя класса.

>со всем остальным ... не понятно
1. По клику проверяются ВСЕ элементы формы (все инпуты всех типов, все текстареа...) и из них по двум признакам - type=="radio" и вхождение в <div id="rad"> отбираются в массив z те самые нужные 9-ть радиокнопок.
2. Одновременно каждая найденная радиокнопка проверяется на отмеченность и, если какая-то кнопка какого-то из трёх "столбцов" отмечена, то значение соответствующего "столбцу" элемента массива w меняется с нуля на единицу.
3. Затем цикл "пробегает" по массиву z, но не подряд, а по "столбцам" и, в зависимости от значения соответствующего элемента массива w, делает радиокнопки столбцов активными или неактивными.

Благодарю, вроде бы работает, а как сделать "ту кнопку" которой можно очистить набранные варианты?

<form> ... <div id="rad" onclick="f (1)"> <input name="s" type="radio" value="s1">s1 <input name="s" type="radio" value="s2">s2 <input name="s" type="radio" value="s3">s3 <br> <input name="r1" type="radio" value="r1">r1 <input name="r1" type="radio" value="r2">r2 <input name="r1" type="radio" value="r3">r3 <br> <input name="n1" type="radio" value="n1">n1 <input name="n1" type="radio" value="n2">n2 <input name="n1" type="radio" value="n3">n3 </div> <input type="button" onclick="f (0)" value="Сброс"> ... </form> <script> function f (x) { for (var y = document.getElementById ('rad').childNodes, z = [], w = [], j = 0, k = -1; j < y.length; j++) if (y [j].type == 'radio') {z [++k] = y [j]; if (y [j].checked) w [k % 3] = 1} for (var j = 0; j < 3; j++) for (var i = 0; i < 7; i = i + 3) if (x) z [j + i].disabled = (!z [j + i].checked && w [j]) ? 1 : 0; else z [j + i].disabled = z [j + i].checked = 0; } </script>