我的雲端生活網 - Life+

Tuesday, September 16, 2008

Open WYSIWYG 網頁編輯器配置小技巧

OpenWYSIWYG, http://www.openwebware.com/ , 是很好的網頁程式元件. 除了是全JavaScript寫作的, 也是跨平台適用的.

我有段網頁程式是:

<p>
內容:
<textarea id="content" name="content" style="width: 100%;" rows="6"></textarea>
說明:
<textarea id="content1" name="content1" style="width: 100%;" rows="7"></textarea>
</p>

按照 OpenWYSIWYG 的說明書, 在開頭加上 <script language="JavaScript" type="text/javascript" src="script/wysiwyg.js"></script> <script language="JavaScript" type="text/javascript" src="script/wysiwyg-settings.js"></script> , 文件尾端加上:

<script language="javascript1.2">
var mySettings = new WYSIWYG.Settings();
mySettings.ImagesDir = 'image/';
WYSIWYG.attach('content', mySettings);
</script>

, 所有 script, style 和影像檔都放對位置, 網頁在 FireFox 成功顯示, 卻在 IE 6 出現錯誤:

行: 809
字元: 6
錯誤: 原始 HTML 對這個操作無效
程式碼: 0
URL: ...

翻出 wysiwyg.js 808 行是 textarea.insertAdjacentHTML("afterEnd", editor);
MSDN對insertAdjacentHTML的註解是:網頁正載入時不可做這個操作.
不過, 經過一些檢測, 上述錯誤不是由這個原因發生.

想來想去, 覺得是網頁文件結構不對吧 (non-well-formatted) ... 後來把文件改成:

<p>
<div>內容:
<textarea id="content" name="content" style="width: 100%;" rows="6"></textarea>
</div>
說明:
<textarea id="content1" name="content1" style="width: 100%;" rows="7"></textarea>
</p>

在 IE 就完成了. 我想 OpenWYSIWYG 對網頁結構是敏感的.

No comments:

Blog Archive