如何在三重选择器类上使用.not（）jQuery选择器？

Question

我有两个共享常见html类的按钮有问题。这两个按钮都是教程的一部分。在教程逐步进行时，首先显示“跳过”按钮。随着教程进入最后一步，再进入新的教程页面，第3方JS程序包会动态向跳过按钮添加另一个类，并将内部html更改为Continue。我的问题在下面一个按钮是：<a class="introjs-button introjs-skipbutton" role="button" tabindex="0">Skip</a>另一个按钮是<a class="introjs-button introjs-skipbutton introjs-donebutton" role="button" tabindex="0">Continue</a>这些按钮是具有某些步骤的教程指南的一部分。它们不会同时显示。但是，单击“跳过”按钮会触发与“继续”按钮相同的操作，如下面的JS代码中所示。我希望在单击“跳过”按钮时仅触发该动作，但是这两种动作都会同时触发，因此我不知道该如何解决。我想采取某种行动，但只能在<a class="introjs-button introjs-skipbutton>被解雇时才解雇，而在不<a class="introjs-button introjs-skipbutton introjs-donebutton>被解雇时才解雇。$("a.introjs-button.introjs-skipbutton").not(".introjs-donebutton").click(() => {    console.log('skipbuttontriggered')    this._app.skipTutorial = true;})我尝试了各种组合，并希望对使用三层堆叠html类的not（）选择器有一些了解。

Answer 1

如果要introjs-donebutton动态添加和删除类，则可以使用事件委托和使用选择器来实现:not()。

$(document).on("click", "a.introjs-button.introjs-skipbutton:not(.introjs-donebutton)", () => {

    console.log('skipbuttontriggered')

    this._app.skipTutorial = true;

})