javascript - 使用文本框动态取消选中容器中的所有复选框

Question

fiddle - http://jsbin.com/OruFonU/1/edit
完成的 fiddle (对于任何在同一条船上的人)- http://jsbin.com/OruFonU/15/edit

我试图根据文本框中的文本取消选中所有复选框。如果文本框的值等于“全部取消选中”，我希望在它的容器 div 中取消选中所有复选框。 (不是全部，只是都在可见容器内)

我尝试了以下但没有成功。

.removeAttr('checked');
.attr('checked', false);
.prop('checked', false);
.is(':checked', false);

这是完整的 JQuery/Javascript

$(document).ready(function() {
  $('input[type=checkbox]').prop('checked', 'checked');
    $('.show').hide();
    $('.number-1').show();

  $(".show-nums").on('load change', function() {
    var val = $(this).val().toLowerCase();

    if( $("." + val) && $("." + val).length ){
      //check if there is a selector that corresponds to the value of the dropdown
      $('.show').hide();
      $("." + val).show();
    }
  });

  $(".search").on('keyup change', function() {
    var val = $(this).val();

    if(val === "Uncheck All") {
      $('.number-1 input[type=checkbox], .number-2 input[type=checkbox], .number-3 input[type=checkbox], .number-4 input[type=checkbox]').prop('checked', false);
    }
  });
});

如果有人能帮我解决这个问题，我将不胜感激。

Answer 1

这是因为你将 form 包裹在 p 标签中。尝试将表单放入 div 中，它应该会按预期工作

Demo