以下のスクリプトでは、htmlStrTOCpreの初期値を静的に保ち、変更されないようにします。ただし、テキスト領域を編集すると、元に戻すと元のテキストがテキスト領域に貼り付けられなくなります。htmlStrTOCpreは、ページ読み込み時の初期値ではなく、undoTOC関数が呼び出されたときのtextareaのhtml()に基づいているためだと思います。
その初期値を保存して、(undoTOC関数を介して)いつでもテキストエリアに貼り付けることができるようにするにはどうすればよいですか?
<script>
jQuery(document).ready(function()
{
var pageurl = jQuery("#sample-permalink").text();
var htmlStrTOCpre = jQuery("#cb2_customTOC").html();
var htmlStrTOC = '<h3>Table of Contents</h3>\n';
htmlStrTOC += '<ul>\n';
htmlStrTOC += ' <li><a href="'+pageurl+'">Introduction </a></li>\n';
htmlStrTOC += ' <li><a href="'+pageurl+'2/">Introduction </a></li>\n';
htmlStrTOC += ' <li><a href="'+pageurl+'3/">Conclusion </a></li>\n';
htmlStrTOC += '</ul>';
var checkTOC = function()
{
jQuery("#cb2_customTOC").html(htmlStrTOC);
}
jQuery("#cb-toc-click").bind("click", checkTOC);
var undoTOC = function()
{
jQuery("#cb2_customTOC").html(htmlStrTOCpre);
}
jQuery("#cb-toc-undo").bind("click", undoTOC);
</script>
<div id="post_TOC" class="postbox ">
<h3 class="hndle"><span>Table of Contents</span></h3>
<div class="inside">
<style>
.cb-toc{color:blue;text-decoration:underline;cursor:pointer;}
</style>
<div class="inside">
<textarea name="cb2_customTOC" id="cb2_customTOC">Some initial value</textarea>
<span class="cb-toc" id="cb-toc-click">Paste TOC</span> | <span class="cb-toc" id="cb-toc-undo">Undo</span></p>
</div>
</div>
</div>
<span id="sample-permalink">http://localhost:8888/test/</span>