.hasClass 在 onclick 函数中不起作用，但删除和添加类函数可以答案

【问题标题】：.hasClass not working inside a onclick function but remove and add class functions do.hasClass 在 onclick 函数中不起作用，但删除和添加类函数可以
【发布时间】：2016-05-06 07:44:00
【问题描述】：

$(document).ready(function(){


$('#vDets').on('mouseover',function(){
             $('#vDets').removeClass("SelectDef").addClass("SelectHov");

 });
$('#vDets').on('mouseout',function(){
             $('#vDets').removeClass("SelectHov").addClass("SelectDef");
 });
 $("#vDets").on('click',function(){              
            $('#vDets').removeClass("SelectDef").addClass("SelectTick");
             var boolCheck = $("#vDets").hasClass("SelectDef");


 });
});

我在上面的代码中遇到了问题，hasClass 在不在 onclick 函数内时可以工作，但会引发错误

未捕获的类型错误：$(...).hasClass 不是函数

当在内部使用时，尽管函数 removeClass 和 addClass 都可以工作。

我之前用过hasClass很多次，从来没有遇到过这个问题

【问题讨论】：

请您为此创建 jsfiddle，然后我可以在那里尝试一下
#CurrentPageId div 存在吗？
什么是CurrentPageId？您正在将 SelectDef 类添加到 vDets 但检查 CurrentPageId...
无法复制。请创建一个 Short, Self Contained, Correct (Compilable), Example 来展示这种行为。
@Malik, Ryxle：具体ID是否存在无关紧要，$().hasClass（在一个空的jQuery对象上）仍然是一个函数。

标签： javascript jquery

【解决方案1】：

嗯，我刚刚测试过，一切正常 jsfiddle - click.

JS：

$(document).ready(function(){


$('#vDets').on('mouseover',function(){
             $('#vDets').removeClass("SelectDef").addClass("SelectHov");

 });
$('#vDets').on('mouseout',function(){
             $('#vDets').removeClass("SelectHov").addClass("SelectDef");
 });
 $("#vDets").on('click',function(){              
            $('#vDets').removeClass("SelectDef").addClass("SelectTick");
            //those run after click
            var boolCheck1 = $("#vDets").hasClass("SelectDef");
            var boolCheck2 = $("#vDets").hasClass("SelectHov");
                        $('#result1').text( boolCheck1 );
            $('#result2').text( boolCheck2 );
 });
 //run outside function without click
 $('#result1').text( $("#vDets").hasClass("SelectDef") );
 $('#result2').text( $("#vDets").hasClass("SelectHov") );
});

HTML：

<div id="vDets" class="SelectDef">
click me
</div>
result for SelectDef:
<div id="result1">

</div>
result for SelectHov:
<div id="result2">

</div>

也许你想使用boolCheck 外部函数？它在外面不可用:)

编辑：你不能在这里删除类：

 $("#vDets").on('click',function(){              
            $('#vDets').removeClass("SelectDef").addClass("SelectTick");

因为当你想点击它时会是SelectHov:

$('#vDets').on('mouseover',function(){
             $('#vDets').removeClass("SelectDef").addClass("SelectHov");

 });

【讨论】：

谢谢，我发现了我在页面中遇到冲突的问题，不知道从哪里来，但已经在这部分代码中添加了 noConflict 并且它现在正在工作，但是我已经更新了点击部分删除 removeClass 而只是打开和关闭刻度类。