jQuery - 保留原始html内容并检索它,即使被覆盖

Question

我在numbersdiv中有一些内容.单击时numbers-clicker,数字的内容将123456789保存到oldNumbers变量,内容将更改为987654321,并且opened在numbersdiv 上切换类.当我numbers-clicker再次点击时,我正在尝试恢复原来的oldNumbers,所以123456789对于numbersdiv,相反,oldNumbers被覆盖了987654321.我们如何确保oldNumbers保持为numbersdiv 的开头内容123456789？

<div id="numbers-clicker">Clicker</div>
<div id="numbers">123456789</div>

$('#numbers-clicker').off('click').on('click',function(){
    $this = $(this);
    var oldNumbers = $('#numbers').html();

    if(!$this.is('.opened')){ 
        $('#numbers').html('987654321'); 
    } else { 
        $('#numbers').html(oldNumbers); 
    }
    $this.toggleClass('opened')
});

这是一个小提琴

Answer 1

您需要oldNumbers在回调之外声明:

var oldNumbers = $('#numbers').html();
$('#numbers-clicker').off(...);

干杯