javascript - 无法删除悬停时由 addClass 添加的类

Question

我有一个简单的 jquery，它在 10 秒后添加 hide_share 类，它工作完美，但我想当用户将鼠标悬停在该类上时删除该类。

.hide_share {
    opacity :0.1;
}

此函数添加 hide_share 类

    setTimeout(function() {$("#main_id").addClass("hide_share");}, 10000);

但是当用户带来光标时，我想删除 hide_share 类，以便它再次可见

看起来很简单，但浪费了我几个小时，然后我搜索了整个 stackoverflow 并尝试了专家给出的所有想法，但没有奏效

这是我的删除功能

 $("#main_id").hover(function () {$(this).removeClass("hide_share");} );    

当我在控制台中运行相同的东西时，它可以工作，我可以看到该类已被删除，但不是直接删除。

我已经尝试做所有事情，甚至在头部添加了脚本标签，但这也不起作用并删除了它。 我尝试了子参数和所有内容，

这里是html

<div id="main_id" class="button-position-left hide_share"><div class="button-label"><span>Share</span></div><div class="button2">Img_here</div></div>

谁能告诉我我哪里做错了。我使用过类似的代码，并且它曾经完美地工作。

Answer 1

也许您正在寻找这个:

$("#main_id").hover(function () {
  $(this).removeClass("hide_share");
}, function () {
  $(this).addClass("hide_share"); 
});

setTimeout(function() {$("#main_id").addClass("hide_share");}, 10000);

.hide_share {
    opacity :0.1;
}

#main_id {
  width: 100px;
  height: 100px;
  background-color: cyan;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="main_id" class="button-position-left"></div>

.hover()方法支持 2 个参数:handlerIn 和 handlerOut。您可以将用户离开光标时的事​​件设置为第二个参数。