在使用Javascript鼠标悬停时，我有一个单独的div更改颜色，但我需要在使用后重置该功能？

Question

以下是代码的链接。

我需要能够在＆＃34; red＆＃34;之间来回徘徊。和＆＃34; blk＆＃34;功能也来回改变颜色。我相信它需要以某种方式重置？

http://jsfiddle.net/kAMG7/

$('#red').on('mouseover', function() {
$('#blue1').addClass("green");
});
$('#blk').on('mouseover', function() {
$('#blue1').addClass("black");
});

谢谢。

Answer 1

试

$('#red').on('mouseover', function() {
$('#blue1').addClass("green");
$('#blue1').removeClass("black");
});
$('#blk').on('mouseover', function() {
$('#blue1').addClass("black");
$('#blue1').removeClass("green");
});

Answer 2

$(document).ready(function()
{
$('#red').mouseover(function() {
$('#blue1').addClass("green");
});
});

$(document).ready(function()
{
$('#red').mouseout(function() {
$('#blue1').removeClass("green");
});
});

Answer 3

$("#red").hover(
  function() {
    $("#blue1").addClass("green");
  },
  function() {
    $('#blue1').removeClass("green");
  }
);

$("#blk").hover(
  function() {
    $("#blue1").addClass("black");
  },
  function() {
    $('#blue1').removeClass("black");
  }
);