Question

我正在尝试在JQuery中存储背景颜色，以便我可以为背景设置动画，然后将其恢复为原始颜色。问题是我将动画基于悬停的“a.someclass”，但背景颜色属性位于“a.someclass”链接所在的div类中。

我确信我可以重构我的HTML / CSS来实现这一点，但我很好奇我将如何在JQuery中完成它。我认为当你看到我不正确的JQuery并且小提琴时，你会明白我的意思。

非常感谢SO

Answer 1

jQuery提供了一种存储任意“数据”的方法。您不要通过更改其他人的属性将其写在另一个DOM元素上。

以下内容存储链接的背景颜色，在悬停时将其当前颜色设置为其他颜色的动画，然后在mouseOut上返回其状态。这是你在中期所拥有的吗？

$("a.configureboxlink").hover(function() {
    var oldColor = $(this).data('oldColor') || $(this).css('background-color');
    $(this).data('oldColor', oldColor)
        .stop().animate({'background-color': 'red'});
}, function() {
    var oldColor = $(this).data('oldColor');
    $(this).stop().animate({'background-color': oldColor});
});

jsFiddle

Answer 2

我修改了你的jsFiddle ......这就是你要找的东西吗？

http://jsfiddle.net/7FxJC/18/

首先，声明var ORIGINAL的方式只允许访问该函数内部的那个变量（在这种情况下是mouseover函数）。由于我们需要它可以访问，我使用jQuery的.data（）方法（http://api.jquery.com/data/）将该标记的父级背景颜色存储到元素本身，稍后再回忆它我们需要它。

我使用.parent（）方法来抓取引用标记的父级以获取它的背景颜色。

JQuery - 存储BackgroundColor var，动画，然后返回var

2 个答案: