javascript - 如果 'this' 类为 true，则禁用按钮

Question

我正在开发这个应用程序，它允许您将人员从 API 添加到应用程序的列表中。每次添加人员时，都会创建一张新的 Bootstrap 卡。我试图弄清楚如何在某些情况下禁用单击“观看流”的按钮。如果用户处于“LIVE”状态，则 .popover_status_on 类将添加到父元素中。如果用户处于“离线”状态，则会添加 .popover_status_off 类。

我认为这将是一个快速解决问题，但我似乎遇到的麻烦比我预期的要多。现在，这就是我正在查看的代码，该代码无法正常工作，我绝对认为它会这样:

if($('.card > .card-body > h2').hasClass('popover_status_off')) {
        $('.card > .card-body > button').prop('disabled', true);
      } else {
        return;
      }

我意识到，当它被禁用时，它会禁用所有按钮，甚至是“实时”按钮。所以我试图弄清楚是否有一种方法无需通过类/id 指定就可以改变按钮的状态。我想也许使用“this”会起作用，但我不确定什么代码适用于此。

感谢您的任何反馈。

Answer 1

问题在于，在 if 语句中，jQuery 选择器并不局限于该卡，它会查找所有卡内的所有按钮。

你的代码字面意思是:

If there is card containing an h2 with class popover_status_off
    Then find all cards that have buttons and disable them
Else do nothing

试试这个:

 $('.card h2.popover_status_off').parents('.card').find('button').prop('disabled', true);

您不需要 if 语句。 jQuery 的强大功能之一是您可以识别一个元素并在一条语句中更改它。