1

Здравствуйте.
При выборе нужного checkbox присваивается класс сразу всем label, а нужно только выбираемому. При повторном нажатии класс не удаляется.
При любом выборе показывается блок .block-all, но вот при повторном нажатии на checkbox (чтобы закрыть все блоки), этот блок не закрывается.
Помогите, пожалуйста, исправить ошибки. Спасибо!

$("#block-box input[type='checkbox']").click(function(){
  $(".blocks").hide();
  $("#block-box input[type='checkbox']").not(this).each(function(){
    $("#block-box label").removeClass("label_active");
    $(".block-all").hide();
    this.checked = false;  
  });
  if (this.checked)
    $("." + $(this).data("blockclass")).show();
    $("#block-box label").addClass("label_active");
    $(".block-all").show();
});
.block-ru,
.block-ua,
.block-all {
display: none;
}
.label_active {
color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="block-box">
<label class="label_ru"><input type="checkbox" name="ru" id="ru" value="1" data-blockclass="block-ru">Россия</label>
<label class="label_ua"><input type="checkbox" name="ua" id="ua" value="1" data-blockclass="block-ua">Украина</label>
</div>
<div class="blocks block-ru">Выбор России</div>
<div class="blocks block-ua">Выбор Украины</div>
<div class="blocks block-all">Показ при любом выборе</div>

1 ответ 1

1

$("#block-box input[type='checkbox']").click(function(){
  // hide and deactivate everything
  $(".blocks").hide();
  $(".block-all").hide();
  $("#block-box label").removeClass("label_active");
  // uncheck all other checkboxes
  $("#block-box input[type='checkbox']").not(this).each(function(){
    this.checked = false;  
  });
  // show/activate things for this checkbox, if it is checked
  if (this.checked) {
    $("." + $(this).data("blockclass")).show();
    $(this).closest("label").addClass("label_active");
    $(".block-all").show();
  }
});
.block-ru,
.block-ua,
.block-all {
display: none;
}
.label_active {
color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="block-box">
<label class="label_ru"><input type="checkbox" name="ru" id="ru" value="1" data-blockclass="block-ru">Россия</label>
<label class="label_ua"><input type="checkbox" name="ua" id="ua" value="1" data-blockclass="block-ua">Украина</label>
</div>
<div class="blocks block-ru">Выбор России</div>
<div class="blocks block-ua">Выбор Украины</div>
<div class="blocks block-all">Показ при любом выборе</div>

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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