回發后如何保持HTML div的狀態

Question

我在Webform應用程序中使用CKEditor ，如下所示：

  <div class="editor" runat="server" EnableViewState="true">
       <div cols="10" id="editor1" name="editor1" data-sample-short contenteditable="true" runat="server" EnableViewState="true">
          TEST
       </div>
   </div>

---

我想在回editor1.InnerText后獲得editor1.InnerText ，但不能，因為它是無狀態的HTML div，同時我不能使用等效的服務器控件，因為我已經處理了該控件上的必需事件。 回發后如何保存數據？

Answer 1

使用隱藏的文本字段，如下所示：

<asp:TextBox ID="tbTransfer" runat="server" TextMode="Multiline"></asp:TextBox>

用Javascript：

//Set Transfer Textbox display to none
document.getElementById('MainContent_tbTransfer').style.display = "none";

//Set Initial Source Code of CKEditor to Transfer TextBox's value
CKEDITOR.instances.editor1.setData(document.getElementById('MainContent_tbTransfer').value);

//Use this function for when you want to do the PostBack
function PostBack() {
    var temp = CKEDITOR.instances.editor1.getData();

    document.getElementById('MainContent_tbTransfer').value = temp.replace(/</g, "d123").replace(/>/g, "d321").replace(/&/g,"d111");
}

在后面的代碼中：

//Getting the HTML source code of CKEditor from the Transfer Textbox and Decrypting it
string htmlToSave = tbTransfer.Text.Replace("d123", "<").Replace("d321", ">").Replace("d111", "&");

//Setting back the Transfer Textbox's text to the decrypted HTML source code
//for when the page reloads at the end of the function,
//CKEditor sets its data = Transfer Textbox's Text
tbTransfer.Text = htmlToSave;

HTML代碼的加密和解密是必需的，因為Web瀏覽器會將字符“ <”，“>”，“＆”識別為HTML標記，並且不允許您在“文本”框中使用純HTML文本回發。

如果您的文本框在瀏覽器中具有不同的ID，請不要忘記更改“ MainContent_tbTransfer”