如果$ this没有ClassName，则执行jquery操作

Question

我看到了很多答案，但似乎都没有用。

我所有的按钮都具有“ Trev”类。我想检查单击的类是否还包含“ Namdons”类，如果有，请执行一些代码。但是，如果没有，请执行一些代码。

一些有效的代码是：

$(".Trev").click
(
    function(e) 
    {

        if($(this).hasClass("Namdons")) 
        {
            console.log("Namdons");
        }
        else
        {
            console.log("Asdf");
        }
        e.preventDefault();

    }
);

但是“ else”条件没有执行。

我尝试过：

$(".Trev").click
(
    function(e) 
    {

        if($(this).hasClass("Namdons")) 
        {
            console.log("Namdons");
        }
        if(!$(this).hasClass("Namdons"))   //added apostrophe
        {
            console.log("Asdf");
        }
        e.preventDefault();

    }
);

按照这些页面：

How to check if an element does NOT have a specific class?How do I use hasClass to detect if a class is NOT the class I want?

“ not”命令不适用，因为我只想采购一个元素而不选择一堆。在这些页面上有更多解释。

HTML：

<div class="Trev Width50" onclick="Button('buttonname')"></div>

和

<button onclick="Namdons()" class="Namdons Trev TextAlignCenter">ButtonTitle</button>

也尝试将Width50 div更改为按钮：

<button class="Trev Width50" onclick="Button('buttonname')"></button>

在javascript中似乎也没有“ elseif”是正确的吗？

谢谢。

Answer 1

由于您标记了javascript，所以我将示例放在香草js中。我留给您将其翻译为jQuery。我也在里面放了笔记：

const trev = document.querySelectorAll('button.trev'); // get button with .trev style
for (var i=0; i < trev.length; i++) { // itterate them
  trev[i].addEventListener('click', function() { // add click event
    if (this.classList.contains('Namdons')) {alert('This is .Namdons');} // if it has .Namdons alert it
    else {alert('This is NOT .Namdons');} // it not alert that
  });
} 

<button class="Trev TextAlignCenter">ButtonTitle</button>
<button class="Namdons Trev TextAlignCenter">ButtonTitle</button>
<button class="Trev TextAlignCenter">ButtonTitle</button>
<button class="Namdons Trev TextAlignCenter">ButtonTitle</button>
<button class="Trev TextAlignCenter">ButtonTitle</button>

阅读有关MDN上classList的更多信息>