jquery hover pass variable a la función de devolución de llamada

Question

Estoy tratando de eliminar un atributo de título para un enlace en hover y luego agregarlo de vuelta en el mouse. Me gustaría pasar var hoverText al vuelo estacionario ...

Aquí está el código que tengo. ¿Algunas ideas?

$(".icon a").hover(function() { 
    $this = $(this); 
    var hoverText = $.data(this, 'title', $this.attr('title'));        
    $(this).find("em").animate({opacity: "show", top: "-35"}, "slow"); 
    $(this).find("em").text(hoverText);  

    $this.removeAttr('title');  


}, function(hoverText) {    

    $(this).find("em").animate({opacity: "hide", top: "-45"}, "fast");  
    $(this).attr("title", hoverText); 

}); 

Answer 1

Ponga "hoverText" como variable global.

var hoverText = ''; 
$(".icon a").hover(function() { 
    $this = $(this); 
    hoverText = $.data(this, 'title', $this.attr('title'));        
    $(this).find("em").animate({opacity: "show", top: "-35"}, "slow"); 
    $(this).find("em").text(hoverText);  

    $this.removeAttr('title');  


}, function() {    

    $(this).find("em").animate({opacity: "hide", top: "-45"}, "fast");  
    $(this).attr("title", hoverText); 

}); 

Answer 2

$(".icon a").hover(function() { 
    $this = $(this); 
    $.data(this, 'title', $this.attr('title'));        
    $(this).find("em").animate({opacity: "show", top: "-35"}, "slow"); 
    $(this).find("em").text(hoverText);  

    $this.removeAttr('title');  


}, function(hoverText) {    

    $(this).find("em").animate({opacity: "hide", top: "-45"}, "fast");  
    $(this).attr("title", $.data(this, 'title'); 

}); 

El truco es:

$.data(this, 'title'); 

Al utilizar los datos, usted está almacenando de manera efectiva la variable en ese elemento DOM con el propósito expreso que acabas de describir. También podría resolver el problema declarando la variable $ this por encima de su función hover inicial, expandiendo el alcance para cubrir ambos.