Editor.htm
<textarea style="behavior:url('Editor.htc');"></textarea>
Editor.htc
<public:attach event=oncontentready onevent=initEditor()>
<script>
//对象
var vColorObject=null;
var vFontObject=null;
var vFontFamilyDiv=null;
var vFontSizeDiv=null;
var vFileObject=null;
var vConsoleDiv=null;
var vEditorDiv=null;
//按钮提示文本
var strButtonTitleArray=new Array("新建","打开","保存","剪切","复制","粘贴","取消","恢复","粗体","斜体","下划","表格","向左","居中","向右","编号","符号","缩进","缩出","字色","字号","字体","图像","链接","水平","打印","预览");
//按钮静态文本
var strButtonValueArray=new Array("新建","打开","保存","剪切","复制","粘贴","取消","恢复","粗体","斜体","下划","表格","向左","居中","向右","编号","符号","缩进","缩出","字色","字号","字体","图像","链接","水平","打印","预览");
//按钮接口程序
var strButtonDefineFunctionArray=new Array("defineNew()",
"defineOpen()",
"defineSave()",
"defineCut()",
"defineCopy()",
"definePaste()",
"defineUndo()",
"defineRedo()",
"defineBold()",
"defineItalic()",
"defineUnderLine()",
"defineTable()",
"defineJustifyLeft()",
"defineJustifyCenter()",
"defineJustifyRight()",
"defineInsertOrderedList()",
"defineInsertUnorderedList()",
"defineOutdent()",
"defineIndent()",
"defineColor()",
"defineFontSize()",
"defineFontFamily()",
"defineInsertImage()",
"defineCreateLink()",
"defineInsertHorizontalRule()",
"definePrint()",
"definePreview()");
//按钮图标
var strButtonDefineIconArray=new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","");
//按钮响应库
function defineNew()
{
vEditorDiv.innerHTML="";
}
function defineOpen()
{
openFileDlg();
}
function defineSave()
{
element.value=vEditorDiv.innerHTML;
}
function defineCut()
{
vEditorDiv.focus();
document.execCommand("Cut");
vEditorDiv.focus();
}
function defineCopy()
{
vEditorDiv.focus();
document.execCommand("Copy");
vEditorDiv.focus();
}
function definePaste()
{
vEditorDiv.focus();
document.execCommand("Paste");
vEditorDiv.focus();
}
function defineUndo()
{
vEditorDiv.focus();
document.execCommand("Undo");
vEditorDiv.focus();
}
function defineRedo()
{
vEditorDiv.focus();
document.execCommand("Redo");
vEditorDiv.focus();
}
function defineBold()
{
vEditorDiv.focus();
document.execCommand("Bold");
vEditorDiv.focus();
}
function defineItalic()
{
vEditorDiv.focus();
document.execCommand("Italic");
vEditorDiv.focus();
}
function defineUnderLine()
{
vEditorDiv.focus();
document.execCommand("UnderLine");
vEditorDiv.focus();
}
function defineTable()
{
window.confirm("Table");
}
function defineJustifyLeft()
{
vEditorDiv.focus();
document.execCommand("JustifyLeft");
vEditorDiv.focus();
}
function defineJustifyCenter()
{
vEditorDiv.focus();
document.execCommand("JustifyCenter");
vEditorDiv.focus();
}
function defineJustifyRight()
{
vEditorDiv.focus();
document.execCommand("JustifyRight");
vEditorDiv.focus();
}
function defineInsertOrderedList()
{
vEditorDiv.focus();
document.execCommand("InsertOrderedList");
vEditorDiv.focus();
}
function defineInsertUnorderedList()
{
vEditorDiv.focus();
document.execCommand("InsertUnorderedList");
vEditorDiv.focus();
}
function defineOutdent()
{
vEditorDiv.focus();
document.execCommand("Outdent");
vEditorDiv.focus();
}
function defineIndent()
{
vEditorDiv.focus();
document.execCommand("Indent");
vEditorDiv.focus();
}
function defineColor()
{
chooseColor();
}
function defineFontSize()
{
chooseFontSize();
}
function defineFontFamily()
{
chooseFontFamily();
}
function defineInsertImage()
{
vEditorDiv.focus();
document.execCommand("InsertImage");
vEditorDiv.focus();
}
function defineCreateLink()
{
vEditorDiv.focus();
document.execCommand("CreateLink");
vEditorDiv.focus();
}
function defineInsertHorizontalRule()
{
vEditorDiv.focus();
document.execCommand("InsertHorizontalRule");
vEditorDiv.focus();
}
function definePrint()
{
vEditorDiv.focus();
document.execCommand("Print");
vEditorDiv.focus();
}
function definePreview()
{
window.confirm("Preview");
}
//辅助函数
//颜色滴管
function chooseColor()
{
var strReturnColor=vColorObject.ChooseColorDlg("FFFFFF");
strReturnColor=strReturnColor.toString(16);
if(strReturnColor.length<6)
{
var strTempString="000000".substring(0,6-strReturnColor.length);
strReturnColor=strTempString.concat(strReturnColor);
}
vEditorDiv.focus();
document.execCommand("ForeColor",false,strReturnColor);
vEditorDiv.focus();
}
function chooseFontSize()
{
var vObject=window.event.srcElement;
vFontSizeDiv.style.display="";
vFontSizeDiv.style.left=getElementDefineLeft(vObject);
vFontSizeDiv.style.top=getElementDefineTop(vObject)+vObject.offsetHeight;
element.document.attachEvent('onmousedown',onDocumentMouseDown);
}
function chooseFontFamily()
{
var vObject=window.event.srcElement;
vFontFamilyDiv.style.display="";
vFontFamilyDiv.style.left=getElementDefineLeft(vObject);
vFontFamilyDiv.style.top=getElementDefineTop(vObject)+vObject.offsetHeight;
element.document.attachEvent('onmousedown',onDocumentMouseDown);
}
//打开文件
function openFileDlg()
{
try
{
vFileObject.CancelError=true;
vFileObject.ShowOpen();
return vFileObject.filename;
}
catch(e)
{
return e;
}
}
function onFontFamilyChange()
{
var vObject=window.event.srcElement;
var strReturnFontFamily=vObject.options[vObject.selectedIndex].text;
vEditorDiv.focus();
document.execCommand("FontName",false,strReturnFontFamily);
vEditorDiv.focus();
vFontFamilyDiv.style.display="none";
element.document.detachEvent("onmousedown",onDocumentMouseDown);
}
function onFontSizeChange()
{
var vObject=window.event.srcElement;
var strReturnFontSize=vObject.options[vObject.selectedIndex].text;
vEditorDiv.focus();
document.execCommand("FontSize",false,strReturnFontSize);
vEditorDiv.focus();
vFontSizeDiv.style.display="none";
element.document.detachEvent("onmousedown",onDocumentMouseDown);
}
function onDocumentMouseDown()
{
if(vFontFamilyDiv.contains(event.srcElement))
{
return;
}
if(vFontSizeDiv.contains(event.srcElement))
{
return;
}
vFontSizeDiv.style.display="none";
vFontFamilyDiv.style.display="none";
element.document.detachEvent("onmousedown",onDocumentMouseDown);
}
//初始化函数
function initEditor()
{
element.style.display="none";
vConsoleDiv=document.createElement("div");
vConsoleDiv.style.border="1px solid #000000";
vConsoleDiv.style.borderBottom="0px solid #000000";
vConsoleDiv.style.position="absolute";
vConsoleDiv.style.width="100%";
vConsoleDiv.style.left=getElementDefineLeft(element);
vConsoleDiv.style.top=getElementDefineTop(element);
window.document.body.insertAdjacentElement("afterbegin",vConsoleDiv);
initConsole();
vEditorDiv=document.createElement("div");
vEditorDiv.style.border="1px solid #000000";
vEditorDiv.style.position="absolute";
vEditorDiv.style.width="100%";
vEditorDiv.style.height="50%";
vEditorDiv.contentEditable=true;
vEditorDiv.style.left=getElementDefineLeft(element);
vEditorDiv.style.top=getElementDefineTop(element)+vConsoleDiv.offsetHeight;
window.document.body.insertAdjacentElement("afterbegin",vEditorDiv);
vColorObject=document.createElement("object");
vColorObject.classid="clsid:3050F819-98B5-11CF-BB82-00AA00BDCE0B";
vColorObject.codeBase="";
vColorObject.style.width=0;
vColorObject.style.height=0;
window.document.body.insertAdjacentElement("afterbegin",vColorObject);
vFontObject=document.createElement("object");
vFontObject.classid="clsid:3050F819-98B5-11CF-BB82-00AA00BDCE0B";
vFontObject.codeBase="";
vFontObject.style.width=0;
vFontObject.style.height=0;
window.document.body.insertAdjacentElement("afterbegin",vFontObject);
//字体选择初始化
vFontFamilyDiv=document.createElement("div");
var vSelect=document.createElement("select");
vSelect.style.border="1px solid #000000";
vSelect.length=vFontObject.fonts.count;
for(kIndex=1;kIndex<=vFontObject.fonts.count;kIndex++)
{
vOption=document.createElement("option");
vOption.value=kIndex;
vOption.text=vFontObject.fonts(kIndex);
vSelect.add(vOption);
}
vSelect.attachEvent("onchange",onFontFamilyChange);
vFontFamilyDiv.appendChild(vSelect);
window.document.body.insertAdjacentElement("afterbegin",vFontFamilyD