Question

（以下代码）尝试对div中的文字产生悬停效果。使用JQuery中的类选择器并且当我使用$('.abc')时它没有击中，但是当我使用$('#top-nav-1')时它确实有效 - 不确定为什么当我通过辅助类选择它时它不会被击中。我可以通过并使用所有id，但我宁愿只使用一个class - 毕竟，这就是他们的目的！

提前感谢您对此的输入。

HTML：

<div id="top-nav-1" class-"container abc">The Text</div>

CSS：

.container {
    color: black;
}

JQuery的：

$('.abc').hover(function() {
    $(this).css('color','red'); 
});

小提琴：http://jsfiddle.net/yB9Jq/

Answer 1

您有一个拼写错误：class=，而不是class-（=而非-）。

此外，jQuery的.hover()将两个函数作为参数：

.hover( handlerIn(eventObject), handlerOut(eventObject) )

所以一个例子是：

$('.abc').hover(
  function() {
     $(this).css('color','red'); 
  },
  function() {
     $(this).css('color',''); 
  }
);

Your fiddle, updated.

Answer 2

您的标记不正确。您需要class="container abc"而不是class-"container abc"

<div id="top-nav-1" class="container abc">The Text</div>

http://jsfiddle.net/yB9Jq/1/

当使用辅助类作为选择器时，JQuery没有命中

2 个答案: