50 lines
1.5 KiB
HTML
50 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
</head>
|
|
<body>
|
|
<h1>Document</h1>
|
|
<div>
|
|
<textarea id="desc" style="width: 500px; height: 300px;">test</textarea>
|
|
</div>
|
|
<div>
|
|
<button id="btn">edit</button>
|
|
</div>
|
|
<hr>
|
|
<div id="popup" style="display: none;">
|
|
<div>
|
|
<button id="close">close</button>
|
|
</div>
|
|
<iframe id="iframe" width="600" height="500" style="border: none;" src="editor1.html"></iframe>
|
|
</div>
|
|
|
|
<script>
|
|
const btn = document.getElementById('btn');
|
|
const popup = document.getElementById('popup');
|
|
const close = document.getElementById('close');
|
|
const iframe = document.getElementById('iframe');
|
|
const desc = document.getElementById('desc');
|
|
|
|
btn.addEventListener('click', () => {
|
|
popup.style.display = 'block';
|
|
iframe.contentWindow.postMessage(desc.value, '/');
|
|
});
|
|
|
|
close.addEventListener('click', () => {
|
|
popup.style.display = 'none';
|
|
});
|
|
|
|
window.addEventListener('message', (event) => {
|
|
// 檢查是否為物件且來自 editor 的儲存操作
|
|
if (typeof event.data === 'object' &&
|
|
event.data.source === 'editor.btn.click') {
|
|
desc.value = event.data.desc;
|
|
popup.style.display = 'none';
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |