javascript - 原型(prototype)点击，鼠标悬停和鼠标悬停不能一起使用吗？

我正在尝试做一个非常简单的按钮，该按钮会根据鼠标悬停，鼠标移开和
单击，我正在原型(prototype)中进行此操作，很奇怪的是，如果我使用mouseover和mouseout，
当我点击按钮后，按钮不会变成白色，似乎是因为鼠标移开了，这是我的代码

$("izzy").observe('mouseover', function() {
     $('izzy').setStyle({ color: '#FFFFFF' });
});

$("izzy").observe('mouseout', function() {
     $('izzy').setStyle({ color: '#666666' });
});

$("izzy").observe('click', function() {
     $('izzy').setStyle({ color: '#FFFFFF' });
});

我该如何解决？谢谢。

最佳答案

除非鼠标反复移出其他东西，否则为什么不使用CSS？

#izzy:hover { color: '#FFFFFF'; }

但是，对于您到底要发生什么，我有些困惑。假定您希望按钮为白色(如果已单击)或鼠标悬停在其上方。我会让click事件处理程序添加一个clicked类，如下所示:

$("izzy").observe('click', function() {
    $('izzy').addClass('selected');
});

和CSS一样

#izzy { color: '#666666'; }
#izzy:hover, #izzy.selected { color: '#FFFFFF'; }

这具有将状态(单击/不单击和鼠标悬停/不悬停)与样式(黑色或灰色)分开的优点。现在，它们混在一起，造成了困惑，并使自己容易受到错误的攻击。