jquery 全局变量与局部变量

Question

尝试自学jquery。以下代码片段工作正常，但我认为可以使代码更短/更高效。

  //Alter the stylesheet to hide the contents of the page initially. 
  //When the page is loaded, fade in the contents slowly.
  var backgroundBuffer;
  $('p').mouseover(function() {
      backgroundBuffer = $(this).css("background-color");
      $(this).css({"background-color": 'yellow'});
    }).mouseout(function(){
      $(this).css({"background-color": backgroundBuffer});
  });

我不想全局声明“backgroundBuffer”，因为我再也不会使用它了。但是如果我在 .mouseover() 中声明它，系统将无法在后面的 .mouseout() 中识别它

  //Alter the stylesheet to hide the contents of the page initially. 
  //When the page is loaded, fade in the contents slowly.
  $('p').mouseover(function() {
      var backgroundBuffer; 
      backgroundBuffer = $(this).css("background-color");
      $(this).css({"background-color": 'yellow'});
    }).mouseout(function(){
      $(this).css({"background-color": backgroundBuffer});
  });

感谢您的帮助!

Answer 1

使用jQuery数据存储初始值...

$('p').mouseover(function() {
  $(this).data('oldcolor', $(this).css("background-color")).css('background-color', 'yellow');
}).mouseout(function(){
  $(this).css("background-color",$(this).data('oldcolor'));
});