jquery hover（）。addClass（）问题

Question

http://jsfiddle.net/aBaw6/2/

此示例在您悬停列表项时不会添加类。

我在这里做错了什么？

$("li").hover(
    function() { 
    $(this).addClass('hover); 
    }, 
    function() { 
    $(this).removeClass("hover"); 
    } 
); 

HTML

<ul> 
    <li>Milk</li> 
    <li>Bread</li> 
    <li>Chips</li> 
    <li>Socks</li> 
</ul> 

CSS

.hover{ 
    color:green; 
    font-size: 20px; 
} 

在此先感谢。

Answer 1

你的JavaScript竟被形成：

$("li").hover(
    function() { 
    $(this).addClass('hover); 
    }, 
    function() { 
    $(this).removeClass("hover"); 
    } 
); 

应该是：

$("li").hover(
    function() { 
    $(this).addClass('hover'); 
    }, 
    function() { 
    $(this).removeClass('hover'); 
    } 
); 

如果您在JS Lint按钮点击屏幕的顶部，将已经告诉你这（这ISN不打算作为批评，只是注意为您未来使用JS小提琴）。

Answer 2

您的JavaScript语法不正确

$(this).addClass('hover); 

应该是：

$(this).addClass('hover'); 

你忘了终止字符串。

它适用于这种变化。

Answer 3

你已经错过了报价“

$("li").hover(
     function() { 
     $(this).addClass('hover'); 
     }, 
     function() { 
     $(this).removeClass("hover"); 
     } 
    ); 

Answer 4

而另一些人指出，失踪引号，我会注意的是，你真的应该使用CSS而不是JavaScript的这样做：

http://jsfiddle.net/aBaw6/8/

li:hover{ 
    color:green; 
    font-size: 20px; 
} 

IE6在<li>上不支持此操作，但可以用<a>和样式包装内容如果需要支持。

如果你没有使用JavaScript，你可以减少你的代码是这样的：

http://jsfiddle.net/aBaw6/7/

$("li").hover(function (e) { 
    $(this).toggleClass('hover', e.type === 'mouseenter'); 
});