Question

我正在尝试检查onclick如果div将两个不同类中的一个添加到主div类中，如果没有这样的话 - 返回警报。以下是所有可能的div的例子：

<div class="mainclass class1"></div>
<div class="mainclass class2"></div>
<div class="mainclass"></div>

如果我正在尝试使用类似于

的JS来检查类的存在

$('.mainclass').click(function () {
    var check1 = $(this).hasClass('class1');
    var check2 = $(this).hasClass('class2');
    if(check1 == false || check2 == false)
                { 
                    alert("Hey, you are clicking empty field!")
                }
});

即使我点击前两个div，系统也会始终返回警报。有没有办法用JS进行适当的检查？

Answer 1

选择要跟踪的对象时，更容易应用这些限制：

$('.mainclass').not('.class1, .class2').click(function () {
  alert("Hey, you are clicking empty field!")
});

如果确实动态添加/删除了这些类，请再次直接说明您的意图：

$('.mainclass').click(function() {
    if ( $(this).is(':not(.class1, .class2)') ) { 
        alert("Hey, you are clicking empty field!");
    }
});

Answer 2

将运营商更改为&&而不是||：

$('.mainclass').click(function () {
var check1 = $(this).hasClass('class1');
var check2 = $(this).hasClass('class2');
if(check1 == false && check2 == false)
            { 
                alert("Hey, you are clicking empty field!")
            }
});

<强> Working Demo

Answer 3

您需要在此处使用AND &&运算符，而不是OR ||：

if(check1 == false && check2 == false)

<强> Fiddle Demo

Answer 4

只需像这样查看

$('.mainclass').click(function () {
    var check1 = $(this).hasClass('class1');
    var check2 = $(this).hasClass('class2');
    if(!check1 && !check2 )
                { 
                    alert("Hey, you are clicking empty field!")
                }
});

另一种方式

$('.mainclass').click(function () {

    if(!$(this).hasClass('class1') && !$(this).hasClass('class2'))
         { 
            alert("Hey, you are clicking empty field!")
         }
 });

Javascript div class check onclick

4 个答案: