?? editor.js
字號:
/**
* sLinkFieldName：相關(guān)的文本框名稱。 sInitMode：初始化模式。"CODE","EDIT","VIEW"。
* sWebEditorName：編輯器名稱。
*/
Pn.Editor = function(config) {
config = config || {};
this.initConfig = config;
Pn.apply(this, config);
// 瀏覽器版本檢測
this.BrowserInfo = new Object();
this.BrowserInfo.majorVer = navigator.appVersion.match(/MSIE (.)/)[1];
this.BrowserInfo.minorVer = navigator.appVersion.match(/MSIE .\.(.)/)[1];
this.BrowserInfo.isIE55OrMore = this.BrowserInfo.majorVer >= 6
|| (this.BrowserInfo.majorVer >= 5 && this.BrowserInfo.minorVer >= 5);
// 當前模式
this.sCurrMode = null;
this.bEditMode = null;
// 編輯器
this.eWebEditor = document.frames[this.sWebEditorName];
// 關(guān)聯(lián)的字段
this.oLinkField = document.getElementsByName(this.sLinkFieldName)[0];
var url = location.href;
// 基本路徑
this.sBaseUrl = url.substring(0,url.lastIndexOf('/')+1);
// 縮放，百分比。
this.nCurrZoomSize = 100;
this.sContentFlag = "0";
this.sContentEdit = "";
this.sContentLoad = "";
if (this.sContentFlag == "0") {
this.sContentEdit = this.oLinkField.value;
this.sContentLoad = this.oLinkField.value;
this.sContentFlag = "1";
}
// 編輯器的模式及處理內(nèi)容
this.setMode(this.sInitMode);
this.setLinkedField();
}
// 改變模式：代碼、編輯、預覽
Pn.Editor.prototype.setMode = function(newMode) {
if (newMode != this.sCurrMode) {
var sBody = "";
var msg = "";
switch (this.sCurrMode) {
case "CODE" :
sBody = this.eWebEditor.document.body.innerText;
break;
case "EDIT" :
case "VIEW" :
sBody = this.eWebEditor.document.body.innerHTML;
break;
// 剛打開頁面
default :
sBody = this.sContentEdit;
break;
}
// 更換狀態(tài)按鈕樣式。
try {
document.all[this.sWebEditorName + "_CODE"].className = "p-editor-statusbar-off";
document.all[this.sWebEditorName + "_EDIT"].className = "p-editor-statusbar-off";
document.all[this.sWebEditorName + "_VIEW"].className = "p-editor-statusbar-off";
document.all[this.sWebEditorName + "_" + newMode].className = "p-editor-statusbar-on";
} catch (e) {
}
// 換內(nèi)容
switch (newMode) {
case "CODE" :
this.eWebEditor.document.designMode = "On";
this.eWebEditor.document.open();
this.eWebEditor.document.write(this.styleEditorHeader);
this.eWebEditor.document.body.innerText = sBody;
this.eWebEditor.document.body.contentEditable = "true";
this.eWebEditor.document.oncontextmenu = function(){return false};
this.eWebEditor.document.close();
this.bEditMode = false;
break;
case "EDIT" :
this.eWebEditor.document.designMode = "On";
this.eWebEditor.document.open();
this.eWebEditor.document.write(this.styleEditorHeader);
this.eWebEditor.document.body.innerHTML = sBody;
this.eWebEditor.document.body.contentEditable = "true";
this.eWebEditor.document.oncontextmenu = function(){return false};
this.eWebEditor.document.execCommand("2D-Position", true, true);
this.eWebEditor.document.execCommand("MultipleSelection", true,
true);
this.eWebEditor.document.execCommand("LiveResize", true, true);
this.eWebEditor.document.close();
this.doZoom(this.nCurrZoomSize);
this.bEditMode = true;
break;
case "VIEW" :
this.eWebEditor.document.designMode = "off";
this.eWebEditor.document.open();
this.eWebEditor.document.write(this.styleEditorHeader + sBody);
this.eWebEditor.document.body.contentEditable = "false";
this.eWebEditor.document.close();
this.bEditMode = false;
break;
}
this.sCurrMode = newMode;
// TODO
/*
* disableChildren(eWebEditor_Toolbar);
*
* if ((borderShown != "no") && bEditMode) { borderShown = "no";
* showBorders() }
*/
}
// eWebEditor.focus();
}
/**
* 縮放
*/
Pn.Editor.prototype.doZoom = function(size) {
this.eWebEditor.document.body.runtimeStyle.zoom = size + "%";
this.nCurrZoomSize = size;
}
// 設置所屬表單的提交或reset事件
Pn.Editor.prototype.setLinkedField = function(size) {
if (!this.oLinkField) {
return;
}
var oForm = this.oLinkField.form;
if (!oForm) {
return;
}
// 附加reset、submit事件
var o = this;
oForm.attachEvent("onreset", function(){o.attachReset.call(o)});
oForm.attachEvent("onsubmit", function(){o.attachSubmit.call(o)});
}
// 附加Reset事件
Pn.Editor.prototype.attachReset = function() {
if (!this.bEditMode) {
this.setMode('EDIT');
}
if (this.bEditMode) {
this.eWebEditor.document.body.innerHTML = this.sContentLoad;
} else {
this.eWebEditor.document.body.innerText = this.sContentLoad;
}
}
// 附加Submit事件
Pn.Editor.prototype.attachSubmit = function() {
var oForm = this.oLinkField.form;
if (!oForm) {
return;
}
var html = this.getHTML();
this.sContentEdit = html;
if (this.sCurrMode == "TEXT") {
html = this.htmlEncode(html);
}
if (this.oLinkField.value != null) {
this.oLinkField.value = html;
}
}
// 取編輯器的內(nèi)容
Pn.Editor.prototype.getHTML = function() {
var html;
if (this.bEditMode) {
html = this.eWebEditor.document.body.innerHTML;
} else {
html = this.eWebEditor.document.body.innerText;
}
var re = new RegExp(this.sBaseUrl.replace(/\//, "\/"), "gi");
// alert("re:"+re);
html = html.replace(re, "");
if ((html.toLowerCase() == "<p> </p>")
|| (html.toLowerCase() == "<p></p>")) {
html = "";
}
return html;
}
// 替換特殊字符
Pn.Editor.prototype.htmlEncode = function(text) {
text = text.replace(/&/g, "&");
text = text.replace(/"/g, """);
text = text.replace(/</g, "<");
text = text.replace(/>/g, ">");
text = text.replace(/'/g, "’");
text = text.replace(/\ /g, " ");
text = text.replace(/\n/g, "<br/>");
text = text.replace(/\t/g, " ");
return text;
}
// 格式化編輯器中的內(nèi)容
Pn.Editor.prototype.format = function(what, opt) {
if (!this.validateMode()) {
return;
}
this.eWebEditor.focus();
if (opt == "RemoveFormat") {
what = opt;
opt = null;
}
if (opt == null) {
this.eWebEditor.document.execCommand(what);
} else {
this.eWebEditor.document.execCommand(what, "", opt);
}
this.eWebEditor.focus();
}
// 檢測當前是否允許編輯
Pn.Editor.prototype.validateMode = function() {
if (this.bEditMode) {
return true;
}
alert("需轉(zhuǎn)換為編輯狀態(tài)后才能使用編輯功能！");
this.eWebEditor.focus();
return false;
}
// 插入特殊對象
Pn.Editor.prototype.insert = function(what) {
if (!this.validateMode()) {
return;
}
this.eWebEditor.focus();
var sel = this.eWebEditor.document.selection.createRange();
switch (what) {
// 插入分頁符
case "page" :
this.insertHTML("[NextPage]");
break;
// 插入換行符
case "br" :
this.insertHTML("<br/>");
break;
// 引用片段樣式
case "quote" :
this.insertHTML('<table width=95% border="0" align="Center" cellpadding="6" cellspacing="0" style="border: 1px Dotted #CCCCCC; TABLE-LAYOUT: fixed"><tr><td bgcolor=#F3F3F3 style="WORD-WRAP: break-word"><font style="color: #990000;font-weight:bold">以下是引用片段：</font><br>'
+ HTMLEncode(sel.text) + '</td></tr></table>');
break;
// 字體變大
case "big" :
this.insertHTML("<big>" + sel.text + "</big>");
break;
// 字體變小
case "small" :
this.insertHTML("<small>" + sel.text + "</small>");
break;
default :
alert("錯誤參數(shù)調(diào)用！");
break;
}
sel = null;
}
// 顯示無模式對話框
Pn.Editor.prototype.showDialog = function(url, width, height, optValidate) {
if (optValidate) {
if (!this.validateMode()) {
return;
}
}
this.eWebEditor.focus();
var arr = showModalDialog(url, this.eWebEditor, "dialogWidth:" + width
+ "px;dialogHeight:" + height + "px;help:no;scroll:no;status:no");
this.eWebEditor.focus();
}
// 在當前文檔位置插入.
Pn.Editor.prototype.insertHTML = function(html) {
if (!this.validateMode()) return;
if (this.eWebEditor.document.selection.type.toLowerCase() != "none")
this.eWebEditor.document.selection.clear() ;
this.eWebEditor.document.selection.createRange().pasteHTML(html) ;
}?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -