jquery - HTMLコンテンツを元の値に戻すにはどうすればよいですか？

Question

ユーザーがdivのキーを押すと、htmlは""に設定されます。ただし、ユーザーがdivを離れた後、htmlを元の値に戻したいと思います。どうやってやるの？

私はこれまでに次のコードを持っています：

$(document).one('keypress',"#id",function() { 
        $(this).html("");
    }).focusout(function(){
        //do something 
    });

Answer 1

を使用して要素自体にキャッシュします.data()。

$(document).one('keypress',"#id",function() { 
    $(this).data('html',$(this).html()).html('');
}).focusout(function(){
    $(this).html($(this).data('html'));
});

thisデータをに保存することで、複数のDOM要素に一致するセレクターを含むすべてのセレクターで機能するため、このアプローチを好みます。data()変数（'html'ここ）がページ上の他のコードによって使用されていないことを確認する必要があります。

Answer 2

どうですか：

(function()
{
    var html = null;
    $(document).one('keypress',"#id",function() { 
        html = $(this).html();
        $(this).html("");
    }).focusout(function(){
        //do something 
        $(this).html(html);
    });
})();

html変数をメインスコープに入れないように、自己実行型の無名関数でラップしました。

または、よりjQueryの方法で：

$(document).one('keypress',"#id",function() { 
    $(this).data('orightml', $(this).html());
    $(this).html("");
}).focusout(function(){
    //do something 
    $(this).html($(this).data('orightml'));
});

このようにして、元のhtmlを要素に対して保存します。

Answer 3

多分このようなもの：

var orig;
$(document).one('keypress',"#id",function() { 
        orig = $(this).html();
        $(this).html("");
    }).focusout(function(){
        //do something 
        $(this).html(orig);
    });

Answer 4

フォーカスアウト後に値を回復できるように、値をaa変数に格納する必要があります。

var divValue;
$(document).one('keypress',"#id",function() { 
    divValue = $(this).html();
    $(this).html("");
}).focusout(function(){
    $(this).html(divValue);
});