jQuery переключает наведение / ввод и наведение мыши с помощью простой функции

Question

У меня есть HTML.

<p class="textlimity" title="heyheyhey"> asd</p>

Теперь в js я хотел бы переключать textlimity text () при наведении и наведении мыши, поэтому я написал.

var textlimity = "";
var texlimity_temp = "";


$(document).ready(function(){


    $('.textlimity').live('mouseenter',function(){
     textlimity = $(this).attr("title");
     textlimity_temp = $(this).html();

     $(this).html(textlimity);
    }).live('mouseout',function(){
         setTimeout(function(){console.log(textlimity_temp);$(this).html(textlimity_temp); },200);
    });

});

логика проста: при наведении курсора мыши .textlimity title = "" val () заменяет .textlimity

.html () и делает противоположное при мышлении

Я использовал .html (), потому что у меня мог быть как простой текст, так и html-код внутри обоих title = "" или

кто-нибудь предложить?

Answer 1

Вот и адаптация @ кода Дэвида со всеми проблемами решенными ..

$('.textlimity').live('mouseenter', function() {
    var self = $(this);
    clearTimeout( self.data('restore') );
    if (!self.data('saved')) {
        self.data('saved', self.html()); // store the original content
    }
    self.html(this.title); // set content from title
}).live('mouseout', function() {
    var self = $(this);
    self.data( 'restore', setTimeout(function() {
        self.html(self.data('saved')); // revert to the stored content
    }, 200) );
});

демо на http://jsfiddle.net/gaby/dQTDZ/4/

Answer 2

выглядит немного сложнее.Как насчет:

$('.textlimity').live('mouseenter',function(){
    $(this).data( 'saved', $(this).html() ) // store the original content
           .html( this.title ); // set content from title
}).live('mouseout',function(){
     setTimeout(function() {
         $(this).html( $(this).data('saved') ); // revert to the stored content
     }, 200);
});

Скрипка: http://jsfiddle.net/dQTDZ/