在不使用悬停函数的情况下更改悬停状态jQuery？

我使用css为某些元素指定了一个悬停状态。在特定事件之后，我想使用jQuery更改悬停状态。我想更改我在css文件中提到的：悬停类选择器。我知道我可以使用

.hover

函数实现，但我不想使用它，因为这不适合我的应用程序。在我的应用程序中，悬停状态的这种变化是在特定时间内发生的，这意味着在特定时间之后，我必须解除悬停事件的绑定。但在我的应用程序中有许多条件模块，我需要在其中调用此取消绑定事件。许多低效的呼叫解除了我不想要的绑定

elem {
  width:10px;
}
elem:hover {
  width:20px;
}

---

我想将

悬停

状态的宽度从say

20px更改为40px

。我想使用一些简单的东西，比如

.css（'width'，'100px'）

，但是如何在

选择器上调用此函数：hover

据我所知，您只能通过hover事件影响hover：

$('#selector').hover( 
  function() { $(this).css('width','100px'); }, 
  function() { $(this).css('width','10px'); }
});

作为一种替代方法，您可能希望使用和，将css类动态分配给给定元素，因此基本上，当您希望元素悬停在css类上时，您可以：

$('#selector').addClass('hovered');

$('#selector').removeClass('hovered');

你想让你的元素有一个普通的类

$('#selector').addClass('hovered');

$('#selector').removeClass('hovered');

---

这不会真正取代悬停事件，但通过这种方式，您可以随时更改css类。

您可以加载另一个样式表，覆盖elem:hover定义（或将样式节点附加到head）并

---

（持续绑定和解散悬停事件听起来可疑）。您可能想考虑是否导致您发布此问题的行为本身不是问题。

< P>您可以使用在CSS中使用悬停选择器的jQuery添加一个类。

例如

elem {
  width:10px;
}
elem:hover {
  width:20px;
}
elem.jsApplied:hover {
  width:40px;
}

---

你不能仅仅改变CSS中的

elem:hover

规则吗？我不认为

hover（）

的效率会低于您应用的任何其他方法。为什么不使用

CSS

来实现此目标？@David，我并不是说

hover（）

在直接意义上是低效的。实际上，在我的应用程序中，我必须使用

悬停、聚焦、活动

做同样的事情。因此，除了多次调用bind和unbind之外，还有什么方法可以简化这个过程，只需一两步。可能有点像添加或删除

class

@Vladimir，我已经动态地更改了它，比如说基于页面上当前可用的宽度。@Knoxs的宽度可以相对于父div设置（比如以%），或者您可以给出添加类或删除类以更改悬停状态的示例吗？我已经编辑了我的答案，添加或删除css类不依赖于悬停状态，您可以随时使用它们。这是将类添加到选择器而不是其悬停状态。我在

悬停

类中提到的任何css也会影响非悬停状态，实际上影响到所有状态。确实，它会以这种方式工作，但是，您添加或删除的每个类都可以有自己的悬停状态（

。悬停：悬停

），不是吗？实际上这会起作用。但我希望我们可以使用@mediaquerys做同样的事情。我是可能的吗？并且也适用于

elem.jsApplied{width:40px；}

。我想要的是只在hover中添加类。意味着我只想更改悬停宽度。