javascript - 将变量从悬停传递到悬停

Question

http://jsfiddle.net/MwQbE/

我有下面的 jQuery，但我无法将变量传递给第二个函数

$("img").hover(function(){
    var $image = $(this);
    var $imageNowWidth = $image.width();
},function() {
    // get variable value for $image and $imageNowWidth   
});​

在 jsFiddle 上测试时它不起作用，我该怎么做才能将变量传递给第二个函数？

Answer 1

只需在外部定义这两个变量.hover，然后您就可以在 mouseleave 函数中使用它们。见下文，

var $image, $imageNowWidth;
$("img").hover(function(){ //mouseenter
   $image = $(this);
   $imageNowWidth = $image.width();
},function() {            //mouseleave
    //$image and $imageNowWidth is accessible HERE
});​

只是想澄清一下，这this将在mouseleave函数内部可用，以便您可以在内部执行相同或更多操作mouseenter

Answer 2

定义getterand setterfor imageandimageNoWidth如下，

var getImage, getImageNoWidth;
$("img").hover(function(){
   $image = $(this);
   $imageNowWidth = $image.width();
    getImage = function(){
        return $image;
    };
    getImageNoWidth = function(){
        return $imageNowWidth;
    };
},function() {
    // get variable value for $image (getImage()) and $imageNowWidth (getImageNoWidth())
}

Answer 3

在外部声明变量，以便在两个函数中都可以访问它。

var image;
var imageNowWidth;
$("img").hover(function(){
    image = $(this);
    imageNowWidth = $image.width();
},function() {
    // get variable value for $image and $imageNowWidth   
});​

Answer 4

使用 jquery 'data' 方法将变量直接存储在 jquery 对象上：

$("img").hover(function(){
    var $image = $(this);
    $image.data('imageNowWidth',$image.width());
},function() {
    var previousImageWidth = $(this).data('imageNowWidth');
    // do whatever you want to do with the width       
});​