Jquery css颜色更改不起作用

我正在尝试更改lavalamp菜单上文本的颜色，我正在使用以下插件

我所做的如下

 $('#lava').mouseleave(function () {

    $('#lava li').removeClass('selected');  
     $('#lava li').css({color: '#FFF'});  
    //select the current item
    $(this).addClass('selected');  
    $(this).css("color", "white");     

});

但是，当鼠标离开时，它会将所有文本更改为黑色，这是正确的，但是$（this）不会更改为白色

下面是代码和工作演示的副本

---

代码几乎肯定是不正确的。他们认为关键字“this”是一只神奇的野兽，它可以以一种令习惯于其他语言的程序员非常惊讶的方式改变

首先阅读这篇文章，了解什么是“this”，以及它是如何被修改的

然后使用jquery函数proxy(http://api.jquery.com/jQuery.proxy/)将“this”封装到函数中

$('#lava').mouseleave($.proxy(function () {
    $('#lava li').removeClass('selected');  
    $('#lava li').css({color: '#FFF'});  
    //select the current item
    $(this).addClass('selected');  
    $(this).css("color", "white");     

}, this));

---

试着让它在每个li的悬停处改变颜色

// the follow preforms for loop on your li's
$("#lava li").each(function(i) {
        // this is the "hover" function, aka, mouseenter and mouseleave
    $(this).hover(function(eIn) { // this function allows you to do stuff while mouse is over object
        $(this).addClass('selected').css("color", "#FFF"); // FFF is white
    },
    function(eOut) { // this allows you to do stuff when mouse leaves object
        $(this).removeClass('selected').css("color", "#000"); // 000 is black
    });
});

---

我想你想要的是：

基本上，您的mouseleave功能必须如下所示

$('#lava').mouseleave(function () {

    left = Math.round($(".selected").offset().left - $('#lava').offset().left);
    width = $(".selected").width();

    //Set the floating bar position, width and transition
    $('#box').stop(false, true).animate({left: left},{duration:1000, easing: style});   
    $('#box .head').stop(false, true).animate({width:width},{duration:1000, easing: style});      

});

请注意，我还为样式表中的链接添加了颜色定义：

#lava ul a li {  color:#fff; }

（您是否知道，在内联元素（如

a

）中封闭块级元素（如

li

）仅在HTML5中有效？）

至于菜单文本的颜色，我还修改了

$（'#lava li'）。悬停（函数（））

：

---

美元（这个）应该是什么？因为，在代码中，看起来$（this）引用了ul元素。如果你想在这个ul的li上工作，恐怕你的代码是错误的……你能提供JSFIDLE吗？你的代码看起来有效。你能告诉我们你想要实现什么吗？我不确定你的具体问题，但请学习并养成链接jQuery语句的习惯，例如$（this）.addClass（'selected'）.css（“color”，“white”）；请看，它更易于阅读，而且效率更高——每个$（..）构造一个新的jquery对象，重新找到该对象，等等。复制该工作毫无意义。还有——奇怪的是，你在一种情况下使用css（{color:'#FFF'}），在另一种情况下使用css（“color”，“white”）——这是同一件事，在三行之内表达不同是很奇怪的……当你指定文本应该变成白色时，所有文本变成黑色怎么可能是正确的呢？你能提供更多的代码来使用吗，比如你的html，或者你想要的一个例子？我还不能完全理解你的问题。我不同意。我希望当运行.mouseleave时，我希望它保持在上次打开的li上，这样你就可以从代码中看到它会返回到.selected@TommErr。。。你失去了我。要在鼠标悬停在菜单项上后激活该菜单项吗？但假设你在主页上，你将鼠标悬停在“成为合作伙伴”上，但不点击它，你仍然在主页上。那么，为什么要将“成为合作伙伴”链接标记为选中？

   $('#lava li').hover(function () {

    //Get the position and width of the menu item
    left = Math.round($(this).offset().left - $('#lava').offset().left);
    width = $(this).width();
    $(this).css("color","black");

    //Set the floating bar position, width and transition
    $('#box').stop(false, true).animate({left: left},{duration:1000, easing: style});   
    $('#box .head').stop(false, true).animate({width:width},{duration:1000, easing: style});    

//if user click on the menu
},function() { $(this).css("color","white");}).click(function () {

    //reset the selected item
    $('#lava li').removeClass('selected');  

    //select the current item
    $(this).addClass('selected');

});