jquery отключить кнопку, пока первая кнопка не нажата

Question

У меня есть проект в JQuery, который требует, чтобы пользователь нажал кнопку, чтобы загрузить PDF, прежде чем перейти к следующему экрану. Я попытался написать условный оператор, который бы выполнял это действие:

downloadPDF. js

function getPdf () {
  $('.button-rounded').click(function () {
    (pdf.fromHTML($('.message-container').html(), 30, 30, {
      'width': 400,
      'elementHandlers': specialElementHandlers
    }));
    pdf.save('example.pdf');
  });
}

// continue new plan

function getPlan () {
  $('.button-rounded-negative').click(function () {
    var url = "http://www.example.com";
    window.open(url);
  })
}

if ($(getPdf).onClick(false)) {
  $(getPlan).attr('disabled', true)
}else{
  if ($(getPdf).onClick(true)) {
    $(getPlan).attr('disabled', false)
  }
}

Цель состоит в том, чтобы отключить кнопку getPlan до кнопки getPDF нажата кнопка, которая запускает автоматическую c загрузку файла.

К сожалению, я еще не получил его на работу. Если я использую ($(getPdf).click(false)) & отображаемый код, обе кнопки все еще включены. Если я использую .onClick, обе кнопки отключаются.

Как мне обработать это событие? До этого момента я в основном писал приложения / условные операторы в React, поэтому я не совсем понимаю, где я ошибаюсь, в логе условных операторов c.

Answer 1

Это не так, как Javascript работает. Вы не можете помещать обработчики событий в операторы if. Вам также не следует вкладывать обработчики событий (как я полагаю, getPdf() и getPlan() вызываются из onclick атрибутов).

Вместо этого вам нужно включить в DOM вторую кнопку в обработчике кликов для первая кнопка. Попробуйте это:

jQuery(function($) {
  $('.button-rounded').click(function () {
    pdf.fromHTML($('.message-container').html(), 30, 30, {
      'width': 400,
      'elementHandlers': specialElementHandlers
    });
    pdf.save('example.pdf');
  });

  $('.button-rounded-negative').click(function () {
    var url = "http://www.example.com";
    window.open(url);
    $('button-rounded').prop('enabled', true); // enable the button here, 
                                               // assuming it starts in a disabled state
  });
});

Обратите внимание, что вы должны удалить подразумеваемые атрибуты onclick из вашего HTML и использовать только вышеприведенные JS.