javascript - 复选框在编辑页面中不起作用

Question

全选复选框在初始时运行良好。步骤： 1.考虑我选中一些复选框或选中所有复选框，然后保存表单 2.编辑保存的表单显示未选中任何内容。它在初始阶段显示复选框。什么都没有保存。

Javascript

<%= check_box_tag "box_select_all" %>

<%= check_box_tag "box_id[]", box.id, false, class: 'box_select' %>

jQuery

$('body').delegate('#box_select_all', 'click', function() {
  $('.box_select').prop('checked', this.checked);
});


$('body').delegate('.box_select', 'click', function() {
  if ($(".box_select").length == $(".box_select:checked").length) {
    $("#box_select_all").prop("checked", "checked");
  } else {
  $("#box_select_all").prop("checked", false);
  }
});

有谁能够帮我？？

Answer 1

为什么要将该功能委托给主体，当您单击复选框时，将调用该功能。像这样称呼它：

$("#box_select_all").click(function() {
  $(".box_select").prop('checked', this.checked);
});

$(".box_select").click(function() {
  if ($(".box_select").length == $(".box_select:checked").length) {
    $("#box_select_all").prop("checked", "checked");
  } 
  else {
  $("#box_select_all").prop("checked", false);
  }
});

希望它会奏效。

Answer 2

$("#select_all").click(function){
   $(".select_class").attr("checked",true);

});

这意味着您只需为所有复选框添加相同的类，并在您的选择框所有复选框上执行此代码，在其 onclick 功能上。好运