jQuery не снят флажок

$('input[type="checkbox"]').change(function() {
  var number = [];
  $('input[type="checkbox"]:checked').each(function() {
    number.push($(this).val());
  });
  if (number.length == 0) {
    $('.category1').prop('checked', true);
    loaddata();
  } else if ($('#all').checked && number.length != 8) {
    alert('it executed');
    $('#all').attr('checked', false);
    loaddata();
  } else {
    loaddata();
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="expander-list" id="category">
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" id="all" class="category1">all</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="electronics" class="category1">Electronics</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="kitchen" class="category1">Kitchen</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="decoratives" class="category1">Decoratives / Interior</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="homedecor" class="category1">Home Decor</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="furnitures" class="category1">Furnitures</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="toys" class="category1">Toys</label>
    </div>
  </li>
  <li>
    <div class="radio" style="padding-left:0px">
      <label>
        <input type="checkbox" name="filter[]" value="vehicles" class="category1">Vehicles</label>
    </div>
  </li>
</ul>

Моя забота очень проста. нажав на все jQuery, выберете все флажки, но если один из них - un $ ( 'input [type = "checkbox"]' ). change ( function () { var unchecked_flag = false ; $ ( 'input [type = "checkbox"]' ). slice ( 1 ). each ( function () { if ( $ ( this ). prop ( "checked" ) = = false ) { unchecked_flag = true ; } }); if ( unchecked_flag ) { $ ( "#all" ). prop ( "checked" , false ); } else { $ ( "#all" ). prop ( "checked" , true ); } }); $ ( "#all" ). click ( function () { $ ( 'input [type = "checkbox"]' ). prop ( "checked" , true ); }); чем все флажки, необходимо снять флажок. но он не снимает флажок для всех флажков даже в моем случае, если условие не выполняется, и это не предупреждает меня. Как его решить и заблаговременно.

javascript,jquery,html,checkbox,

0

Ответов: 3


1

Вот как я это сделаю:

<script>
$("#all").change(function () {
$("input:checkbox").prop('checked', $(this).prop("checked"));       
});
$(".category1").click(function() {
if( $(this).prop("checked") == false)
{
$(".category1").attr("checked", false);
$("#all").attr("checked", false);
};
});
</script>

Вот демонстрация JSFiddle


0

Привет В соответствии с вашими требованиями, я думаю, что приведенная ниже скрипка решит вашу проблему, попробуйте эту надежду, она вам поможет.

Я сделал это для флажка «все» и «один» для вашей помощи. Вы можете выбрать задачу, как хотите.

** Ваш jquery будет чем-то вроде ниже ..

$('#all').checked

Попробуйте приведенный ниже скрипт

Флажок выберите Fiddle Demo


0
  1. заявление checkedне возвращает то, что вы ожидаете.
    Чтобы получить $('#all').prop('checked')необходимую вам собственность.prop()

  2. Остерегайтесь разницы между .attr()и checked.
    первый получает текущее checkedсвойство, второе возвращает checkedатрибут (статически определенный на странице HTML).
    Избегайте использования, .attr()если вы ищете текущее состояние флажка.

Попробуйте этот фрагмент:

    $('input[type="checkbox"]').change(function() {
       var number = [];
       $('input[type="checkbox"]:checked').each(function() {
          number.push($(this).val());
       });
       if (number.length == 0) {
          $('.category1').prop('checked', true);
          loaddata();
       } else if ($('#all').prop('checked') && number.length !== 8) {
          alert('it executed');
          $('#all').prop('checked', false);
          loaddata();
       } else {
          loaddata();
       }
    });

См. Также jQuery docs

JavaScript, JQuery, HTML, флажок,
Похожие вопросы