0

Есть множество input[type=checkbox], но один из них должен иметь поведение input[type=radio]. Это значит, что все чекбоксы имеют стандартное поведение, но при выборе того самого "особенного" чекбокса, все остальные должны сниматься и наоборот, если выбран "особенный", при выборе обычного, "особенный" становится не выбранным. Я мог бы сделать это с помощью общего name этих элементов, но ситуация усложняется тем, что name представляет собой массив (используются скобки []), потому простой выбор элементов группы затрудняется. Как сделать красиво данную фичу? Я не прошу писать за меня код, мне нужны только примерные приемы.

1
  • 1
    При нажатии на особенный чекбокс делать анселект остальных, а при нажатии на обычный чексбокс делать анселект особенного. Такой вариант не подходит? 14 июн 2016 в 13:19

1 ответ 1

1

Проще сделать, чем объяснять все подробности. И да, рекомендую разобраться с тем как работает этот код, копипаст зло :)

$(document).ready(function() {
  $('body').on('click', 'input[type=checkbox]:not(.special)', function() {
    $('.special').attr('checked', false);
  });
  $('body').on('click', '.special', function() {
    $('input[type=checkbox]:not(.special)').attr('checked', false);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="option_1" />
<input type="checkbox" name="option_2" />
<input type="checkbox" name="option_3" />
<hr />
<input type="checkbox" class="special" name="option_special" />

1
  • Спасибо, я использовал вместо data аттрибута класс, что дало мне возможность использовать селектор :not, но пришлось добавить в селекторы еще и name, потому что у меня несколько групп таких хитрых селекторов. Дополнительно ситуация усложнена тем, что сами ческбоксы скрыты и вместо них отображаются стилизованные лейблы. Несколько раз наткнулся на рекурсию, потому что приходилось вызывать trigger('change'). Но все же я справился с помощью вашего решения. Спасибо.
    – ilyaplot
    14 июн 2016 в 13:50

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.