鼠标悬停后设置变量

Question

$(".squares").on('mouseover', function(){
 $(this).css('background-color', getRandomColor());

getRandomColor（）是一个函数，当鼠标中的网格中的方块时，它返回一个随机颜色函数。

我希望能够重复一次并且颜色会发生变化，但如果我再过一次，颜色会保持不变。现在，每次鼠标悬停后颜色都会反复变化。我知道它可能需要if语句。我只是不知道如何将语句设置为背景颜色。

Answer 1

使用.one()

$(".squares").one('mouseover', function() {
 $(this).css('background-color', getRandomColor());
});

Answer 2

你可以添加一个＆＃39;数据 - ＆＃39;属性，所以你知道它是否已被更改？

Answer 3

您可以使用unbind()事件。这将在mouseover事件被调用后取消绑定。

$(".squares").on('mouseover', function(){
 $(this).css('background-color', getRandomColor());
    $(this).unbind('mouseover');
});

http://jsfiddle.net/j6um1sq2/17/