2

使用 jQuery 编写代码时，我发现自己使用 var self = $(this) 来引用我所在对象的当前上下文。例如：

$('#myDiv').click(function(e){

var self = $(this);

self.css('background', 'red');

});

这很好，但我必须对每个对象重复这个过程。例子：

$('#myDiv').hover(function(){

//hover over function
var self = $(this);
self.css('background', 'red');

}, function(){

//hover out function
var self = $(this);
self.css('background', 'blue');

});

我的问题是有什么方法可以设置 self 的全局变量并使用它来引用我所在的上下文。所以我想设置 self = $(this) 并且无论我在哪里使用它都会自动引用我当前所在的对象？

4

6 回答 6

6

您可以直接$(this).call()使用没有问题

于 2012-06-15T16:38:35.427 回答
3

尝试：

var myDiv = $('#myDiv');

myDiv.hover(function(){
    myDiv.css('background', 'red');
}, function(){
    myDiv.css('background', 'blue');
});
于 2012-06-15T16:36:11.730 回答
1

要$(this)在同一范围内重复使用，您可以像当前一样将其存储在本地。

$('#myDiv').hover(function(){
  var self = $(this);

  self.css('background', 'red');
  // reusing example
  self.find('some').foo();
}, function(){
  var self = $(this);

  self.css('background', 'blue');
  // reusing example
  self.bar();
});

你也可以$(this)自己使用

$('#myDiv').hover(function(){
  $(this).css('background', 'red');
}, function(){
  $(this).css('background', 'blue');
});

但是声明self超出hover范围（我认为对你的情况来说是不必要的）

var self = null; // declare self as global

$('#myDiv').hover(function(){
  self = $(this);
}, function(){
  self = $(this);
});
于 2012-06-15T16:36:00.787 回答
1

声明外部悬停函数可能会使您在两个悬停函数中使用相同的 self 变量，但我建议您使用 #(this) 而不是 self。

var self = $(this);
$('#myDiv').hover(function(){

//hover over function

self.css('background', 'red');
//$(this).css('background', 'red'); //use this is better and more expressive
}, function(){

//hover out function
var self = $(this);
self.css('background', 'blue');
//$(this).css('background', 'red'); //use this is better and more expressive
});
于 2012-06-15T16:39:13.650 回答
0

jsBin 演示

您可以创建一个函数，该函数将为函数参数中包含的所有元素切换背景(el)：

function myFunction(el){

   $(el).hover(function(){
       $(this).css('background', 'red');
   }, function(){
       $(this).css('background', 'blue');
   });

}

比你只调用你的函数并使用你想要的元素：

myFunction('#myDiv');

您可以轻松创建所需元素的列表，例如：

myFunction('#myDiv, #anotherDiv, #heading1, .classes');
于 2012-06-15T16:54:05.147 回答
0

使用 jquerys 数据方法而不是使用全局变量，http: //api.jquery.com/data/

放：

$('body').data({ myVar: $(this) });

得到：

var myVar = $('body').data('myVar');
于 2012-06-15T16:38:31.753 回答