安裝
在嵌入頁面選擇筆記，即可取得含標題欄位和下載按鈕的程式碼。mode: 'notes' 隱藏工具列，開啟區塊選單和字數統計。明確指定的 toolbar、handles、writingMode 優先。
<div id="my-note"></div>
<script src="https://typdit.com/embed/v1.js"></script>
<script>
const note = Typdit.create(document.getElementById('my-note'), {
mode: 'notes',
lang: 'en',
});
</script>標題與內文之間移動
在標題中按 Enter 或下箭頭可移到內文開頭，在內文最開頭按上箭頭可返回標題末尾。輸入法確認文字時不會切換輸入框。
在空清單項目中按 Enter 可結束清單並返回段落。縮排項目會先向外移動一級，此操作也可以復原。
筆記選項
mode: 'notes' | 含標題和下載的筆記編輯器 |
title / snapshot | 初始標題和內文 |
lang | ko、en、ja、zh-cn、zh-tw，預設 en |
downloads: false | 隱藏下載按鈕，筆記模式預設顯示 |
onNoteChange({ title, snapshot }) | 標題或內文變更時傳遞兩者，用於儲存標題 |
儲存和下載
onNoteChange 在標題或內文變更時傳遞 { title, snapshot }，儲存兩者才能保留標題。getNote() 讀取，setNote(note) 還原。原有 onChange(snapshot) 只傳內文。export(format) 回傳字串，download(format) 下載檔案。支援 md、html、txt。
getNote() / setNote(note) | 用 { title, snapshot } 讀取和載入 |
export('md' | 'html' | 'txt') | 將標題和內文匯出為字串，含目前表格輸入 |
download('md' | 'html' | 'txt') | 在瀏覽器下載檔案，附件儲存為連結 |
瀏覽器儲存範例
此範例在目前瀏覽器儲存一篇筆記。同一頁面的多篇筆記請使用不同的儲存鍵。伺服器儲存、登入和權限檢查由你的網站實作。清除瀏覽器資料也會刪除筆記。
若無法讀取已儲存內容，範例會停止自動儲存以保護原副本。此時請下載新寫的內容。
<div id="my-note"></div>
<p id="save-error" role="alert" hidden>儲存失敗，請在離開前下載副本。</p>
<script src="https://typdit.com/embed/v1.js"></script>
<script>
const key = 'my-site:note:meeting';
const warning = document.getElementById('save-error');
let saved = null;
let canSave = true;
try {
saved = JSON.parse(localStorage.getItem(key) || 'null');
if (saved && (typeof saved.title !== 'string' ||
saved.snapshot?.version !== 1 || typeof saved.snapshot.text !== 'string' ||
!Array.isArray(saved.snapshot.blocks) || !Array.isArray(saved.snapshot.marks))) {
throw new Error('Invalid saved note');
}
} catch {
saved = null;
canSave = false;
warning.hidden = false;
}
const note = Typdit.create(document.getElementById('my-note'), {
mode: 'notes',
lang: 'zh-tw',
title: saved?.title || '',
snapshot: saved?.snapshot,
onNoteChange(value) {
if (!canSave) return;
try {
localStorage.setItem(key, JSON.stringify(value));
warning.hidden = true;
} catch { warning.hidden = false; }
},
});
</script>授權與儲存
無需金鑰即可使用。有效的 Plus 授權可移除已註冊網域的浮水印。筆記儲存和上傳由你的網站管理。