JQuery UI два флажка на проверено нужную кнопку, чтобы активировать и на непроверенный отключен

0

Сначала посетите мою скрипку

Здесь я использую кнопку jQuery-ui. То, что я хочу, когда оба check-boxes отмечены, мне нужны кнопки, которые нужно активировать, и removeClass disabledButton, и когда они не отмечены (оба), я хочу, чтобы кнопки были отключены, а addClass disabledButton. Как я могу это сделать?

Вот мой подход jQuery:

$(".conditionCheck").buttonset();    
$(".conditions").click(function () {    
  if ($(".conditions").is(':checked')) {   
    $(".paymentButton").removeAttr("disabled")
      .removeClass("disabledButton");   
  }    
  if (!$(".conditions").is(':checked')) {   
    $(".paymentButton").attr("disabled")
      .addClass("disabledButton");    
  } 
});
Теги:
checkbox

1 ответ

2
Лучший ответ

Используйте $('.conditions').not(':checked').length чтобы получить количество неконтролируемых элементов управления. Если это число равно 0, то оба они были проверены, поэтому вы знаете, что делать.

$(".conditions").click(function () {
  if ($('.conditions').not(':checked').length) {
    $(".paymentButton").prop("disabled", true).addClass("disabledButton");
  }
  else {
    $(".paymentButton").prop("disabled", false).removeClass("disabledButton");
  }
});

Я также изменил неправильное использование attr чтобы отключить элементы с помощью prop который является подходящим способом.

Вышеприведенный код также может быть написан более кратко

var allChecked = $('.conditions').not(':checked').length == 0;
$(".paymentButton").prop("disabled", !allChecked)
                   .toggleClass("disabledButton", !allChecked);

Ещё вопросы

Сообщество Overcoder
Наверх
Меню