悬停时的Jquery addClass和Remove Class答案

【问题标题】：Jquery addClass and Remove Class on hover悬停时的Jquery addClass和Remove Class
【发布时间】：2012-05-22 17:03:44
【问题描述】：

好的，我想在鼠标悬停在元素上时向元素 #searchput 添加一个类 cfse_a，然后当鼠标没有悬停在元素上时删除类 cfse_a。

【问题讨论】：

api.jquery.com/hover、api.jquery.com/addClass 和 api.jquery.com/removeClass。

标签： javascript jquery file

【解决方案1】：

将hover 事件与addClass 和removeClass 方法一起使用：

$("#searchput").hover(function() {
    $(this).addClass("cfse_a");
}, function() {
    $(this).removeClass("cfse_a");
});

演示： http://jsfiddle.net/G23EA/

【讨论】：

@AndersEriksson 如果它像一个魅力，你应该赞成而不是反对它。

【解决方案2】：

$('#searchput').hover(function() {
  $(this).addClass('cfse_a'); // add class when mouseover happen
}, function() {
  $(this).removeClass('cfse_a'); // remove class when mouseout happen
});

你也可以使用：

$('#searchput').hover(function() {
  $(this).toggleClass('cfse_a');
});

见toggleClass()

DEMO

【讨论】：

【解决方案3】：

  $("#searchput").hover(function() {
     $(this).addClass("cfse_a");
     }, function() {
   $(this).removeClass("cfse_a");
   });

使用它。希望它有所帮助！

【讨论】：

【解决方案4】：

希望这会有所帮助。

$('#searchput').mouseover(function() {
    $(this).addClass('cfse_a');
}).mouseout(function(){
    $(this).removeClass('cfse_a');
});

【讨论】：