📄 editor.asp
字号:
<html>
<head>
<title>HTML在线编辑器</title>
<link rel="STYLESHEET" type="text/css" href="edit.css">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body bgcolor="#FFFFFF" STYLE="margin:0pt;padding:0pt">
<div class="yToolbar">
<div class="TBHandle"> </div>
<div class="Btn" TITLE="全部选择" LANGUAGE="javascript" onclick="format('selectall')">
<img class="Ico" src="images\selectall.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="删除" LANGUAGE="javascript" onclick="format('delete')">
<img class="Ico" src="images\del.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="剪切" LANGUAGE="javascript" onclick="format('cut')"> <img class="Ico" src="images\cut.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="Btn" TITLE="复制" LANGUAGE="javascript" onclick="format('copy')">
<img class="Ico" src="images\copy.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="粘贴" LANGUAGE="javascript" onclick="format('paste')">
<img class="Ico" src="images\paste.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="撤消" LANGUAGE="javascript" onclick="format('undo')">
<img class="Ico" src="images\undo.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="恢复" LANGUAGE="javascript" onclick="format('redo')">
<img class="Ico" src="images\redo.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="插入表格" LANGUAGE="javascript" onclick="InsertTable()">
<img class="Ico" src="images\table.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="插入栏目框" LANGUAGE="javascript" onclick="FIELDSET()"> <img class="Ico" src="images\fieldset.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="Btn" TITLE="插入网页" LANGUAGE="javascript" onclick="iframe()"> <img class="Ico" src="images\htm.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="Btn" TITLE="插入图片URL" LANGUAGE="javascript" onclick="pic()"> <img class="Ico" src="images\img.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="TBSep"></div>
<div class="Btn" TITLE="左对齐" NAME="Justify" LANGUAGE="javascript" onclick="format('justifyleft')">
<img class="Ico" src="images\aleft.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="居中" NAME="Justify" LANGUAGE="javascript" onclick="format('justifycenter')">
<img class="Ico" src="images\acenter.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="右对齐" NAME="Justify" LANGUAGE="javascript" onclick="format('justifyright')">
<img class="Ico" src="images\aright.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="插入超级连接" LANGUAGE="javascript" onclick="UserDialog('CreateLink')">
<img class="Ico" src="images\url.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="取消超级链接" LANGUAGE="javascript" onclick="UserDialog('unLink')">
<img class="Ico" src="images\nourl.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="查看帮助" LANGUAGE="javascript" onclick="help()"> <img class="Ico" src="images\help.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="TBSep"></div>
</div>
<div class="yToolbar">
<div class="TBHandle"> </div>
<div class="Btn" TITLE="编号" LANGUAGE="javascript" onclick="format('insertorderedlist')">
<img class="Ico" src="images\num.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="项目符号" LANGUAGE="javascript" onclick="format('insertunorderedlist')">
<img class="Ico" src="images\list.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="减少缩进量" LANGUAGE="javascript" onclick="format('outdent')">
<img class="Ico" src="images\outdent.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="增加缩进量" LANGUAGE="javascript" onclick="format('indent')">
<img class="Ico" src="images\indent.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="删除文字格式" LANGUAGE="javascript" onclick="format('RemoveFormat')">
<img class="Ico" src="images\clear.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="插入flash多媒体文件" LANGUAGE="javascript" onclick="swf()">
<img class="Ico" src="images\flash.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="插入视频文件，支持格式为：avi、wmv、asf" LANGUAGE="javascript" onclick="wmv()">
<img class="Ico" src="images\wmv.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="插入RealPlay文件，支持格式为：rm、ra、ram" LANGUAGE="javascript" onclick="rm()">
<img class="Ico" src="images\rm.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="字体颜色" LANGUAGE="javascript" onclick="foreColor()"> <img class="Ico" src="images\fgcolor.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="Btn" TITLE="加粗" LANGUAGE="javascript" onclick="format('bold')">
<img class="Ico" src="images\bold.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="斜体" LANGUAGE="javascript" onclick="format('italic')">
<img class="Ico" src="images\italic.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="下划线" LANGUAGE="javascript" onclick="format('underline')">
<img class="Ico" src="images\underline.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="上标" LANGUAGE="javascript" onclick="format('superscript')">
<img class="Ico" src="images\sup.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="下标" LANGUAGE="javascript" onclick="format('subscript')">
<img class="Ico" src="images\sub.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="TBSep"></div>
<div class="Btn" TITLE="插入普通水平线" LANGUAGE="javascript" onclick="format('InsertHorizontalRule')">
<img class="Ico" src="images\line.gif" WIDTH="18" HEIGHT="18"> </div>
<div class="Btn" TITLE="插入特殊水平线" LANGUAGE="javascript" onclick="hr()"> <img class="Ico" src="images\sline.gif" WIDTH="18" HEIGHT="18">
</div>
<div class="TBSep"></div>
<div class="Btn" TITLE="保存" LANGUAGE="javascript" onclick="save()"> <img class="Ico" src="images\save.gif" WIDTH="18" HEIGHT="18">
</div>
</div>
<div class="yToolbar">
<div class="TBHandle"> </div>
<select ID="formatSelect" class="TBGen" onchange="format('FormatBlock',this[this.selectedIndex].value);this.selectedIndex=0">
<option selected>段落格式</option>
<option VALUE="<P>">普通</option>
<option VALUE="<PRE>">已编排格式</option>
<option VALUE="<H1>">标题一</option>
<option VALUE="<H2>">标题二</option>
<option VALUE="<H3>">标题三</option>
<option VALUE="<H4>">标题四</option>
<option VALUE="<H5>">标题五</option>
<option VALUE="<H6>">标题六</option>
<option VALUE="<H7>">标题七</option>
</select>
<select id="specialtype" class="TBGen" onchange="specialtype(this[this.selectedIndex].value);this.selectedIndex=0">
<option selected>特殊格式</option>
<option VALUE="SUP">上标</option>
<option VALUE="SUB">下标</option>
<option VALUE="DEL">删除线</option>
<option VALUE="BLINK">闪烁</option>
<option VALUE="BIG">增大字体</option>
<option VALUE="SMALL">减小字体</option>
</select>
<div class="TBSep"></div>
<select id="FontName" class="TBGen" onchange="format('fontname',this[this.selectedIndex].value);this.selectedIndex=0">
<option selected>字体</option>
<option value="宋体">宋体</option>
<option value="黑体">黑体</option>
<option value="楷体_GB2312">楷体</option>
<option value="仿宋_GB2312">仿宋</option>
<option value="隶书">隶书</option>
<option value="幼圆">幼圆</option>
<option value="Arial">Arial</option>
<option value="Arial Black">Arial Black</option>
<option value="Arial Narrow">Arial Narrow</option>
<option value="Brush Script MT">Brush Script MT</option>
<option value="Century Gothic">Century Gothic</option>
<option value="Comic Sans MS">Comic Sans MS</option>
<option value="Courier">Courier</option>
<option value="Courier New">Courier New</option>
<option value="MS Sans Serif">MS Sans Serif</option>
<option value="Script">Script</option>
<option value="System">System</option>
<option value="Times New Roman">Times New Roman</option>
<option value="Verdana">Verdana</option>
<option value="Wide Latin">Wide Latin</option>
<option value="Wingdings">Wingdings</option>
</select>
<select id="FontSize" class="TBGen" onchange="format('fontsize',this[this.selectedIndex].value);this.selectedIndex=0">
<option selected>字号</option>
<option value="7">一号</option>
<option value="6">二号</option>
<option value="5">三号</option>
<option value="4">四号</option>
<option value="3">五号</option>
<option value="2">六号</option>
<option value="1">七号</option>
</select>
<div class="TBSep"></div>
<div class="TBGen" title="查看HTML源代码">
<input id="EditMode" onclick="setMode(this.checked)" type="checkbox">
查看HTML源代码</div>
</div>
<iframe class="HtmlEdit" ID="HtmlEdit" MARGINHEIGHT="1" MARGINWIDTH="1" width="100%" height="264">
</iframe>
<script type="text/javascript">
SEP_PADDING = 5
HANDLE_PADDING = 7
var yToolbars = new Array();
var YInitialized = false;
var bLoad=false
var pureText=true
var bodyTag="<head><style type=\"text/css\">body {font-size: 9pt}</style><meta http-equiv=Content-Type content=\"text/html; charset=gb2312\"></head><BODY bgcolor=\"#FFFFFF\" MONOSPACE>"
var bTextMode=false
public_description=new Editor
function document.onreadystatechange(){
if (YInitialized) return;
YInitialized = true;
var i, s, curr;
for (i=0; i<document.body.all.length; i++)
{
curr=document.body.all[i];
if (curr.className == "yToolbar")
{
InitTB(curr);
yToolbars[yToolbars.length] = curr;
}
}
DoLayout();
window.onresize = DoLayout;
HtmlEdit.document.open();
HtmlEdit.document.write(bodyTag);
HtmlEdit.document.close();
HtmlEdit.document.designMode="On";
}
function InitBtn(btn)
{
btn.onmouseover = BtnMouseOver;
btn.onmouseout = BtnMouseOut;
btn.onmousedown = BtnMouseDown;
btn.onmouseup = BtnMouseUp;
btn.ondragstart = YCancelEvent;
btn.onselectstart = YCancelEvent;
btn.onselect = YCancelEvent;
btn.YUSERONCLICK = btn.onclick;
btn.onclick = YCancelEvent;
btn.YINITIALIZED = true;
return true;
}
function InitTB(y)
{
y.TBWidth = 0;
if (! PopulateTB(y)) return false;
y.style.posWidth = y.TBWidth;
return true;
}
function YCancelEvent()
{
event.returnValue=false;
event.cancelBubble=true;
return false;
}
function PopulateTB(y)
{
var i, elements, element;
elements = y.children;
for (i=0; i<elements.length; i++) {
element = elements[i];
if (element.tagName == "SCRIPT" || element.tagName == "!") continue;
switch (element.className) {
case "Btn":
if (element.YINITIALIZED == null) {
if (! InitBtn(element))
return false;
}
element.style.posLeft = y.TBWidth;
y.TBWidth += element.offsetWidth + 1;
break;
case "TBGen":
element.style.posLeft = y.TBWidth;
y.TBWidth += element.offsetWidth + 1;
break;
case "TBSep":
element.style.posLeft = y.TBWidth + 2;
y.TBWidth += SEP_PADDING;
break;
case "TBHandle":
element.style.posLeft = 2;
y.TBWidth += element.offsetWidth + HANDLE_PADDING;
break;
default:
return false;
}
}
y.TBWidth += 1;
return true;
}
function DebugObject(obj)
{
var msg = "";
for (var i in TB) {
ans=prompt(i+"="+TB[i]+"\n");
if (! ans) break;
}
}
function LayoutTBs()
{
NumTBs = yToolbars.length;
if (NumTBs == 0) return;
var i;
var ScrWid = (document.body.offsetWidth) - 6;
var TotalLen = ScrWid;
for (i = 0 ; i < NumTBs ; i++) {
TB = yToolbars[i];
if (TB.TBWidth > TotalLen) TotalLen = TB.TBWidth;
}
var PrevTB;
var LastStart = 0;
var RelTop = 0;
var LastWid, CurrWid;
var TB = yToolbars[0];
TB.style.posTop = 0;
TB.style.posLeft = 0;
var Start = TB.TBWidth;
for (i = 1 ; i < yToolbars.length ; i++) {
PrevTB = TB;
TB = yToolbars[i];
CurrWid = TB.TBWidth;
if ((Start + CurrWid) > ScrWid) {
Start = 0;
LastWid = TotalLen - LastStart;
}
else {
LastWid = PrevTB.TBWidth;
RelTop -= TB.offsetHeight;
}
TB.style.posTop = RelTop;
TB.style.posLeft = Start;
PrevTB.style.width = LastWid;
LastStart = Start;
Start += CurrWid;
}
TB.style.width = TotalLen - LastStart;
i--;
TB = yToolbars[i];
var TBInd = TB.sourceIndex;
var A = TB.document.all;
var item;
for (i in A) {
item = A.item(i);
if (! item) continue;
if (! item.style) continue;
if (item.sourceIndex <= TBInd) continue;
if (item.style.position == "absolute") continue;
item.style.posTop = RelTop;
}
}
function DoLayout()
{
LayoutTBs();
}
function BtnMouseOver()
{
if (event.srcElement.tagName != "IMG") return false;
var image = event.srcElement;
var element = image.parentElement;
if (image.className == "Ico") element.className = "BtnMouseOverUp";
else if (image.className == "IcoDown") element.className = "BtnMouseOverDown";
event.cancelBubble = true;
}
function BtnMouseOut()
{
if (event.srcElement.tagName != "IMG") {
event.cancelBubble = true;
return false;
}
var image = event.srcElement;
var element = image.parentElement;
yRaisedElement = null;
element.className = "Btn";
image.className = "Ico";
event.cancelBubble = true;
}
function BtnMouseDown()
{
if (event.srcElement.tagName != "IMG") {
event.cancelBubble = true;
event.returnValue=false;
return false;
}
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -