jQuery заменить текст элемента на hover

Question

С jQuery, я пытаюсь заменить текст, включая span, внутри этих ссылок при наведении. Затем, когда пользователь наводится, исходный текст отображается снова.

<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> 

Конечный результат должен быть

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

Я играл вокруг с, но не знаете, как заменить его обратно. Есть идеи?

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

Answer 1

$('.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')); 
    } 
); 

вы можете сохранить исходный текст в атрибуте data-initialText, хранящейся в самом узле так, чтобы избежать переменные

Answer 2

Это должно сделать трюк

$(function(){ 
    var prev;  

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

Answer 3

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

Answer 4

You» d необходимо сохранить его в переменной, чтобы вернуть его к тому, что было, попробуйте:

var text; 

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

Answer 5

добавить еще одну функцию к событию парения, как это:

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

Link для демонстрации