适用JavaScript函数的所有对象的css类

Question

我有这样的代码：

$("#SidingPainting").hover(
      function() { 
       $(this).addClass("ui-state-hover"); 
      }, 
      function() { 
       $(this).removeClass("ui-state-hover"); 
      } 
     ) 

但是我有很多，像一百div的，我想这些相同的功能，适用于！

有没有办法让我可以做一个CSS类，并将其应用到每个div，然后将这些函数应用到CSS类？

或者有关如何让我的生活更轻松的其他想法？

Answer 1

使用jQuery的$可以使用CSS选择器。所以只写.className而不是#id

$(".hoverClass").hover(
     function() { 
      $(this).addClass("ui-state-hover"); 
     }, 
     function() { 
      $(this).removeClass("ui-state-hover"); 
     } 
    ) 

为此，您应该使用:hover伪类，但IE6只支持它的一个标签。所以你需要一个像这样的JavaScript回退。 Detecting IE6 using jQuery.support

Answer 2

如果你只是想改变悬停类，你甚至不需要JavaScript。只要给你所有的div一个普遍的类，并使用CSS :hover伪类来改变hover样式：

.SidingPainting { /* this is a class, not an ID */ 
    ... 
} 

.SidingPainting:hover { 
    ... 
}