2

私は div を持っていて、html()その内容を変更していました。「キャンセル」ボタンをしているhtml()のですが、元の値に戻したいです。

これを行う効率的な方法はありますか？コード全体を再び html() にしないようにしています。これは見栄えが悪く、おそらくベスト プラクティスではないからです。

よろしくお願いします。よろしく

4

7 に答える 7

5 
// store the old content
var myOldContent = $("#cancelbutton").html();

// change content
$("#cancelbutton").html(someNewContent);

// and change it back
$("#cancelbutton").html(myOldContent);
于 2012-04-23T19:31:26.550 に答える
2

.html可能な限り、このようにコンテンツを切り替えるために使用しないでください。2 つの隣接するほぼ同一の要素 (1 つは古い HTML を使用し、もう 1 つは新しい HTML を使用) を使用し、 hiddenCSS クラスを作成display: noneして 2 番目の要素に割り当てます。hidden次に、このクラスを両方の要素で同時に切り替えます。

HTML:

<button class="cancel" id="cancel-original">Cancel</button>
<button class="cancel hidden" id="cancel-second">Cancelling...</button>

CSS:

.hidden {
    display: none;
}

JQuery:

$('button.cancel').click(function() {
    $('button.cancel').toggleClass('hidden'); // toggles both at once
});

http://jsfiddle.net/e9eLP/

于 2012-04-23T19:37:21.217 に答える
1

jQuery の data() 関数を使用すると、元の値を内部で簡単に保持してから、次のように復元できます。

$('#a').click(function(){
    $('div').data('store',$('div').html()).html('foo');
});​​
$('#b').click(function(){
    $('div').html($('div').data('store'));
});
​

jsFiddle の例。(この例は、data() を使用して値を格納する方法を説明するためのものであり、プロダクション コードを対象としたものではないことに注意してください。)

于 2012-04-23T19:36:07.317 に答える
1

作成時にjQueryを使用してクローンを作成し、キャンセルするときにそれを削除して古いバージョンをクローンして戻すことができます.

于 2012-04-23T19:31:37.150 に答える
1

ブラウザは元の値を追跡しません。
ただし、ページの読み込み時に元の HTML を自分で変数に格納できます。

于 2012-04-23T19:31:38.553 に答える
1

以前の HTML コンテンツを変数に保存し、キャンセル時にその変数から復元できます。

var previousHtml = $('#someElement').html();

それで

$('#someElement').html(previousHtml);
于 2012-04-23T19:31:47.917 に答える
1

変更する前に、変数に保存する必要があります。

<script>
var origHTML = $("#divid").html();
function ResetDiv(){
  $("#divid").html(origHTML);
}
</script>
于 2012-04-23T19:32:11.437 に答える