TinyMCE 保存源碼到HTML文件

Question

我是TinyMCE的新人。我想用它來編輯幾個HTML的文件。 可能嗎？

示例： file_to_edit.html


<!DOCTYPE html>
<html lang="en">
  <head>
    <script type="text/javascript" src="C:\Soft\TinyMCE\tinymce\js\tinymce\tinymce.min.js" referrerpolicy="origin"></script>
    <script>
      tinymce.init({
        selector: 'textarea#mytextarea',
        mode: 'textareas',
        plugins: 'code, save',
        toolbar: 'code | save',
        save_enablewhendirty : true,
        save_onsavecallback: () => {
        },
        object_resizing: false
      });
    </script>
  </head>

  <body>
    <h1>Long attribute description</h1>
    <form>
      <textarea id="mytextarea">Attribute description</textarea>
      <h2>HTML output</h2>
    <div class="HTMLContainer"></div>
    </form>
  </body>
</html>

問題：我想使用TinyMCE更改mytextarea字段中的文本

我嘗試了幾種選擇但沒有結果：

我添加了“保存”插件並嘗試使用“保存”工具欄按鈕來保存文本。 但是沒有任何反應。
我在save_onsavecallback lambda 中添加了tinymce.triggerSave()方法
我使用tinymce.activeEditor.save()方法
我試圖改變編輯器模式tinymce.mode.set("design")
tinymce.activeEditor.getContent()和tinymce.activeEditor.setContent()方法

Answer 1

為了了解保存功能的情況，我在您的示例中添加了一個 function 和一個按鈕，以再次嘗試 setContent API 方法。

運行演示，按下保存按鈕確實會在編輯器中設置內容，但隨后頁面會刷新（我猜這是因為啟用了保存選項 - 希望這是這里的目標）。

我還刪除了save_enablewhendirty和:之間的空格，這也可能導致錯誤並停止保存工作。

演示：

<!DOCTYPE html>
<html lang="en">
  <head>
    <script src="/tinymce/js/tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
      tinymce.init({
        selector: 'textarea#mytextarea',
        mode: 'textareas',
        plugins: 'code, save',
        toolbar: 'code | save',
        save_enablewhendirty: true,
        save_onsavecallback: () => {
        },
        object_resizing: false
      });
    </script>
  </head>

  <body>
    <h1>Long attribute description</h1>
    <form>
      <textarea id="mytextarea">Attribute description</textarea>
      <h2>HTML output</h2>
    <div class="HTMLContainer"></div>
    <button id='buttonS'>Save</button>
    </form>
  </body>
<script>
    function saveEditor() {
        tinymce.get("mytextarea").setContent("<p>Content set!</p>");
      }
    var buttonLine = document.getElementById('buttonS');
    buttonLine.addEventListener('click', saveEditor, false);
</script>
</html>

還有一些內容可用於使用 node.js 設置保存插件，用於測試保存編輯器內容的內容與生產中可能發生的內容接近： https://www.tiny.cloud/blog/set-up-the-tinymce-保存插件/

TinyMCE 保存源碼到HTML文件

問題描述

1 個解決方案

解決方案1
0 已采納 2022-12-08 06:12:48

TinyMCE 保存源碼到HTML文件

問題描述

1 個解決方案

解決方案1 0 已采納 2022-12-08 06:12:48

解決方案1
0 已采納 2022-12-08 06:12:48