diff --git a/demo.html b/demo.html
index c0ee9ad..75dbbbc 100644
--- a/demo.html
+++ b/demo.html
@@ -17,8 +17,12 @@
父页面通过地址拼接加载子页面(filePath + mode=edit)
+
- 仅拼接 iframe src:vocd.html?filePath=URL&mode=edit
+ 示例:vocd.html?filePath=URL&mode=edit 或 vocd.html?filePath=URL
@@ -26,23 +30,41 @@
const editorFrame = document.getElementById('editorFrame')
const loadBtn = document.getElementById('loadBtn')
const urlInput = document.getElementById('urlInput')
+ const editModeToggle = document.getElementById('editModeToggle')
+
+ function buildSrc(filePath, isEdit) {
+ const base = './vocd.html'
+ return `${base}?filePath=${encodeURIComponent(filePath)}` + (isEdit ? '&mode=edit' : '')
+ }
// 页面加载后,自动将 iframe 指向 vocd.html 并使用同源 /test.ocd
document.addEventListener('DOMContentLoaded', () => {
const defaultUrl = '/test.ocd' // 来自 public,同源可直接访问
urlInput.value = defaultUrl
const base = './vocd.html'
- const src = `${base}?filePath=${encodeURIComponent(defaultUrl)}&mode=edit`
+ // 默认不勾选:只读模式(不拼接 mode)
+ editModeToggle.checked = false
+ const src = buildSrc(defaultUrl, editModeToggle.checked)
editorFrame.src = src
console.log('[demo] 自动设置 iframe src:', src)
})
+ // 切换编辑模式时,刷新 iframe 地址,保留当前 filePath
+ editModeToggle.addEventListener('change', () => {
+ const typedUrl = urlInput.value.trim()
+ const currentAbs = editorFrame.src || './vocd.html'
+ const currentUrl = new URL(currentAbs, window.location.href)
+ const currentFilePath = currentUrl.searchParams.get('filePath') || (typedUrl || '/test.ocd')
+ const src = buildSrc(currentFilePath, editModeToggle.checked)
+ editorFrame.src = src
+ console.log('[demo] 编辑模式切换,刷新 iframe src:', src)
+ })
+
loadBtn.onclick = () => {
const typedUrl = urlInput.value.trim()
const base = './vocd.html'
- const src = typedUrl
- ? `${base}?filePath=${encodeURIComponent(typedUrl)}&mode=edit`
- : `${base}?mode=edit`
+ const targetUrl = typedUrl || '/test.ocd'
+ const src = buildSrc(targetUrl, editModeToggle.checked)
editorFrame.src = src
console.log('[demo] 设置 iframe src:', src)
}