jQuery reemplazar el texto del elemento al pasar el cursor

Con jQuery, estoy tratando de reemplazar el texto, incluido el tramo, dentro de estos enlaces al pasar el mouse. Luego, cuando el control deslizante del usuario está desactivado, el texto original se muestra de nuevo.jQuery reemplazar el texto del elemento al pasar el cursor

<a class="btn" href="#"> 
    <img src="#" alt=""/> 
    <span>Replace me</span> please 
</a> 

<a class="btn" href="#"> 
    <img src="#" alt=""/> 
    <span>Replace me</span> please 
</a>

El resultado final debe ser

<a class="btn" href="#"> 
    <img src="#" alt=""/> 
    I'm replaced! 
</a>

estoy jugando un poco con el pero no sabe cómo sustituir de nuevo. ¿Algunas ideas?

$('.btn').hover(function(){ 
    $(this).text("I'm replaced!"); 
});

Fuente

2012-05-22 cusejuice

Esto sería mucho más fácil si * todos * los contenidos que se reemplazó estaba dentro de algún elemento. – Jon

¿Necesita que se haga con jQuery o es texto estático? – Paul

http://api.jquery.com/mouseover/#example-0 debería mostrar –

$('.btn').hover(
    function() { 
     var $this = $(this); // caching $(this) 
     $this.data('initialText', $this.text()); 
     $this.text("I'm replaced!"); 
    }, 
    function() { 
     var $this = $(this); // caching $(this) 
     $this.text($this.data('initialText')); 
    } 
);

que podría salvar el texto original en un atributo data-initialText almacenada en el propio nodo Así que para evitar las variables

Fuente

2012-05-22 11:30:52 fcalderan

que publicó este 43 segundos antes que yo, pero lo curioso es que mi conexión a Internet se redujo por una fracción de segundo cuando hice clic en enviar y tuve para ingresar un captcha cuando lo envié –

+1 para data-initialText –

Personalmente, esto lo reemplaza, pero luego cuando el mouse se apaga, ¡aún conserva el texto nuevo! – Dikeneko

Esto debería hacer el truco

$(function(){ 
    var prev;  

    $('.btn').hover(function(){ 
    prev = $(this).text(); 
     $(this).text("I'm replaced!"); 
    }, function(){ 
     $(this).text(prev) 
    }); 
})

Fuente

2012-05-22 11:31:01

$('.btn').hover(function() { 
    // store $(this).text() in a variable  
    $(this).text("I'm replaced!"); 
}, 
function() { 
    // assign it back here 
});

Fuente

2012-05-22 11:31:39 xyz

Usted' d necesita almacenarlo en una variable para volver a configurarlo, intente:

var text; 

$(".btn").hover(function() { 
    text = $(this).text(); 
    $(this).text("I'm replaced!"); 
}, 
function() { 
    $(this).text(text); 
});

Fuente

2012-05-22 11:31:49 mattytommo

agregar otra función al evento vuelo estacionario como esto:

$('.btn').hover(function(){ 
    $(this).text("I'm replaced!"); 
}, function() { 
    $(this).text("Replace me please"); 
});

Link de demostración

Fuente

2012-05-22 11:33:22 optimusprime619

wow ahora me doy cuenta de lo lento que soy ... y un enlace jsfiddle fue una mala idea aquí: '( – optimusprime619

jQuery reemplazar el texto del elemento al pasar el cursor

Respuesta

Cuestiones relacionadas