自己写的html编辑器

系统 1596 0

文件夹 edithtml (包含6个文件)

inputtool.html

< style > ...
body
{...} { margin : 0px ; font-size : 12px ; }
.lv_edithtml_title
{...} { background-color : #F7F8FD ; }
.ico
{...} { border : 1pxsolid#fff ; cursor : hand ; }
.ico_m
{...} { border : 1pxsolid#000 ; cursor : hand ; }
</ style >
< div class ="lv_edithtml_title" >
< img class ="ico" src ="edithtml_include/images/bold.gif" alt ="粗体" onClick ="format('Bold','');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/italic.gif" alt ="斜体" onClick ="format('Italic','');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/underline.gif" alt ="下划线" onClick ="format('Underline','');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/fgcolor.gif" alt ="设置字体颜色" onClick ="insert('color');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/aleft.gif" alt ="格式居左" onClick ="format('justifyleft','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/center.gif" alt ="格式居中" onClick ="format('justifycenter','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/aright.gif" alt ="格式居右" onClick ="format('justifyright','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/copy.gif" alt ="复制" onClick ="format('copy','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/cut.gif" alt ="剪切" onClick ="format('cut','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/paste.gif" alt ="粘贴" onClick ="format('paste','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/delete.gif" alt ="删除" onClick ="format('delete','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/redo.gif" alt ="恢复" onClick ="format('redo','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/undo.gif" alt ="撤销" onClick ="format('undo','')" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/wlink.gif" alt ="插入链接" onClick ="format('CreateLink','');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/hr.gif" alt ="插入水平线" onClick ="format('InsertHorizontalRule','');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />

< img class ="ico" src ="edithtml_include/images/img.gif" alt ="插入图片" onClick ="insert('img');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/flash.gif" alt ="插入动画" onClick ="insert('flash');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< img class ="ico" src ="edithtml_include/images/wmv.gif" alt ="插入节目" onClick ="insert('avi');" onMouseOut ="this.className='ico';" onMouseOver ="this.className='ico_m';" />
< br >
< 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 ="ArialBlack" > ArialBlack </ option >
< option value ="ArialNarrow" > ArialNarrow </ option >
< option value ="BrushScriptMT" > BrushScriptMT </ option >
< option value ="CenturyGothic" > CenturyGothic </ option >
< option value ="ComicSansMS" > ComicSansMS </ option >
< option value ="Courier" > Courier </ option >
< option value ="CourierNew" > CourierNew </ option >
< option value ="MSSansSerif" > MSSansSerif </ option >
< option value ="Script" > Script </ option >
< option value ="System" > System </ option >
< option value ="TimesNewRoman" > TimesNewRoman </ option >
< option value ="Verdana" > Verdana </ option >
< option value ="WideLatin" > WideLatin </ 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 >

编码转换文件 edithtml.asp

< %
function CovHtml(content)
ON ERROR RESUME NEXT
CovHtml
= content
if not isnull (content) then
CovHtml
= replace (CovHtml, " & " , " &amp; " )
CovHtml
= replace (CovHtml, " < " , " &lt; " )
CovHtml
= replace (CovHtml, " > " , " &gt; " )
CovHtml
= replace (CovHtml, chr ( 34 ), " &quot; " )
CovHtml
= replace (CovHtml, chr ( 39 ), " &#39; " )
end if
if Err.Number <> 0 then
CovHtml
= " CovHtml转换中出错请联系管理员<br> "
Err.Clear
end if
endfunction
%
>

js文件 edit.js

// JavaScriptDocument
var bodyTag = " <head><styletype="text/css">body{font-size:9pt}</style><metahttp-equiv=Content-Typecontent="text/html;charset=gb2312"></head><BODYbgcolor="#FFFFFF"MONOSPACE> "
function document.onreadystatechange() ... {
HtmlEdit.document.open()
HtmlEdit.document.write(bodyTag);
HtmlEdit.document.close()
HtmlEdit.document.designMode
= " On "
}

function format(what,value) ... {
if (what != "" ) ... {
if (value != "" ) ... {
HtmlEdit.document.execCommand(what,
"" ,value);
}
else ... {
HtmlEdit.document.execCommand(what);
}

}

HtmlEdit.focus();
}

function insert(what) ... {
if (what == " img " ) ... {
var arr = showModalDialog( " edithtml_include/images/image.htm " , "" , " dialogWidth:430px;dialogHeight:230px;status:0 " );
if (arr != null ) ... {
content
= HtmlEdit.document.body.innerHTML;
content
= content + arr;
HtmlEdit.document.body.innerHTML
= content;
}

}
else if (what == " flash " ) ... {
var arr = showModalDialog( " edithtml_include/images/flash.htm " , "" , " dialogWidth:430px;dialogHeight:200px;status:0 " );
if (arr != null ) ... {
content
= HtmlEdit.document.body.innerHTML;
content
= content + arr;
HtmlEdit.document.body.innerHTML
= content;
}

}
else if (what == " avi " ) ... {
var arr = showModalDialog( " edithtml_include/images/video.htm " , "" , " dialogWidth:430px;dialogHeight:200px;status:0 " );
if (arr != null ) ... {
content
= HtmlEdit.document.body.innerHTML;
content
= content + arr;
HtmlEdit.document.body.innerHTML
= content;
}

}
else if (what == " color " ) border
分享到:
评论

自己写的html编辑器


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论