Question

我有一个用于多次删除的jquery函数。

  $('input.delete-selected[type="submit"]').attr('disabled','disabled');
  $('[id^=partners_], [id^=invitations_], [id^=clients_], [id^=partner_services_], [id^=partner_products_]').on("click", function (event) {
  if ($(this).is(":checked")) {
        $('input.delete-selected[type="submit"]').removeAttr('disabled');
    } else {
        $('input.delete-selected[type="submit"]').attr('disabled', 'disabled');
    }
  })

问题是，如果我有2个项目，请同时选择其中一项，然后取消选择其中一项，再次禁用“删除”按钮。

如果未选中复选框，我该如何禁用该按钮？我是否必须实现每个功能？

Answer 1

使用prop()：

$('input.delete-selected[type="submit"]').prop('disabled', ($('[id^=partners_]:checked, [id^=invitations_]:checked, [id^=clients_]:checked, [id^=partner_services_]:checked, [id^=partner_products_]:checked').length == 0));

这将是disable按钮，具体取决于第二个参数评估状态。

如果是true，则按钮将被禁用，否则将启用按钮。

$('[id^=partners_]:checked, [id^=invitations_]:checked, [id^=clients_]:checked, [id^=partner_services_]:checked, [id^=partner_products_]:checked').length会检查复选框的数量。

Answer 2

试试这个：在一个变量中获取所有复选框选择器并将click事件绑定到它。内部点击处理程序查看是否选中了任何复选框，然后相应地启用/禁用该按钮。使用.prop()代替.attr()

$('input.delete-selected[type="submit"]').attr('disabled','disabled');
var $checkbox = $('[id^=partners_], [id^=invitations_], [id^=clients_], [id^=partner_services_], [id^=partner_products_]');
  $($checkbox).on("click", function (event) {
      $('input.delete-selected[type="submit"]').prop('disabled', $checkbox.is(':checked').length==0);
  });

Answer 3

您可以使用变量flag来计算选中的复选框数，如果选中了至少一个复选框，则删除禁用您知道的其他内容。

  $('input.delete-selected[type="submit"]').attr('disabled','disabled');
  $('[id^=partners_], [id^=invitations_], [id^=clients_], [id^=partner_services_], [id^=partner_products_]').on("click", function (event) {
    var flag = 0;  //HERE IS THE VARIABLE
  if ($(this).is(":checked")) {
        flag += 1;  //HERE
    } else {
        flag -= 1;  //HERE
    }
  });

if(flag <= 0)
{
    $('input.delete-selected[type="submit"]').attr('disabled', 'disabled');
}
else {
    $('input.delete-selected[type="submit"]').removeAttr('disabled');
}

Answer 4

$('input.delete-selected[type="submit"]').attr('disabled','disabled');
$('[id^=partners_], [id^=invitations_], [id^=clients_], [id^=partner_services_], [id^=partner_products_]').on("click", function (event) {
    if ($(this).siblings().andSelf().prop("checked").length > 0) {
        $('input.delete-selected[type="submit"]').removeAttr('disabled');
    } else {
        $('input.delete-selected[type="submit"]').attr('disabled', 'disabled');
    }
})

如果没有选中复选框，则禁用按钮jquery

4 个答案: