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

时间:2015-07-20 11:43:18

标签: javascript jquery ruby-on-rails

我有一个用于多次删除的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个项目,请同时选择其中一项,然后取消选择其中一项,再次禁用“删除”按钮。

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

4 个答案:

答案 0 :(得分: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会检查复选框的数量。

答案 1 :(得分:1)

试试这个:在一个变量中获取所有复选框选择器并将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);
  });

答案 2 :(得分:1)

您可以使用变量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');
}

答案 3 :(得分:0)

$('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');
    }
})