HTML在线编辑器（QQ邮箱编辑器）

//Global def var gTBPart = ["base", "style", "format", "more", "html"]; var gTBCmds = ["bold", "italic", "underline", "fontname", "fontsize", "forecolor", (gIsFF)?"hilitecolor":"backcolor", "alignmode", "serial", "indent", "createlink","picture"]; var gTBCmdsIdx = fIndexCreater(gTBCmds); //Gen tool bar function fGenToolBarHtml() { var commHeadMenu = [ '<div style="background:url(', gEditorPath, 'images/editoricon.gif) -$left$px 0;width:$w$px;margin:$m$;height:17px;float:left;" unselectable="on"' ].join( "" ); var commTail = '></div>'; var partDisp = []; for (var i = 0, len = gTBPart.length; i < len; i++) { partDisp.push(gEditorToolBarSet[gTBPart[i]] == false ? "display:none;" : ";"); } var dat= [ //id,bg-left,width,margin,style,title ["tb_"+gTBCmds[0],"0","19","0",partDisp[0],"加粗"] ,["tb_"+gTBCmds[1],"20","20","0",partDisp[0],"斜体"] ,["tb_"+gTBCmds[2],"40","20","0",partDisp[0],"下划线"] ,["-","320","3","-1px 3px 0 4px",partDisp[0],"间隔线"] ,["tb_"+gTBCmds[3],"60","20","0 2px",partDisp[1],"选择字体"] ,["tb_"+gTBCmds[4],"80","21","0 2px",partDisp[1],"字体大小"] ,["tb_"+gTBCmds[5],"240","20","0 2px",partDisp[1],"字体颜色"] ,["tb_"+gTBCmds[6],"260","20","0 2px",partDisp[1],"背景颜色"] ,["-","320","3","-1px 4px 0 2px",partDisp[1],"间隔线"] ,["tb_"+gTBCmds[7],"427","21","0 4px 0 0",partDisp[2],"对齐方式"] ,["tb_"+gTBCmds[8],"449","22","0 4px 0 0",partDisp[2],"编号"] ,["tb_"+gTBCmds[9],"470","22","0 4px 0 0",partDisp[2],"缩进"] ,["-","320","3","-1px 3px 0 1px",partDisp[2],"间隔线"] ,["tb_"+gTBCmds[10],"280","22","0",partDisp[3],"增加链接"] ,["tb_"+gTBCmds[11],"322","22","0",partDisp[4],"插入图片"] ]; var templ = ( [ '<div id="$id$" style="background:url(', gEditorPath, 'images/editoricon.gif) -$left$px 0;width:$w$px;margin:$m$;$s$" class="editor_btn" unselectable="on" title="$title$" onmousedown=fOnTBMouseDown(this) onmouseover=fOnTBMouseOver(this) onmouseout=fOnTBMouseOut(this) onmouseup=fOnTBMouseOver(this)></div>' ].join( "" ) ).split("$"); var code = [ "<div id='", gEditorToolBarId, "' class='editor_toolbar' unselectable='on'>", "<div id='editor_toolbar_comm' style='float:left;margin:0 4px;''>", fGenHtml(dat, templ), "<div id='editor_toolbarplus' style='float:left;'></div>", "</div>", "<div class='editor_abtn' id='editor_htmlbtn' onclick='fChangeEditor(1);' unselectable='on' style='", partDisp[4], "' title='编辑HTML源码'>&lt;HTML&gt;</div>", "<div class='editor_abtn' id='editor_sourcebtn' style='display:none;' onclick='fChangeEditor();' unselectable='on' title='预览效果'>预览<b>&#187;</b></div>", "</div>" ]; //menu board var menuH = '<div class="editor_menu" unselectable="on" onmouseover=fOnMenuMouseOver(this) onmouseout=fOnMenuMouseOut(this) para="$v$" '; var menuT = '</div>'; var colorDat = [ [0, 0] ,['000000'],['993300'],['333300'],['003300'],['003366'],['000080'],['333399'],['333333'] ,['800000'],['FF6600'],['808000'],['008000'],['008080'],['0000FF'],['666699'],['808080'] ,['FF0000'],['FF9900'],['99CC00'],['339966'],['33CCCC'],['3366FF'],['800080'],['999999'] ,['FF00FF'],['FFCC00'],['FFFF00'],['00FF00'],['00FFFF'],['00CCFF'],['993366'],['C0C0C0'] ,['FF99CC'],['FFCC99'],['FFFF99'],['CCFFCC'],['CCFFFF'],['99CCFF'],['CC99FF'],['FFFFFF'] ]; var colorDat2 = colorDat.slice(0); for (var i = colorDat2.length - 1; i > 0; i--) colorDat2[i].push('&nbsp;', gIsIE ? 14 : 12, gIsIE ? 12 : 10); colorDat2[0] = [0, 2, 3, 0, 1]; var dat = [ [[0, "cc0000","00b085","00b085","663399","00ade5","663399","0066cc","00ade5"]] ,[[2, "eb4200","a90005","a90005","d13800","bc4b00","eb4200","a90005","bc4b00"]] ,[[3, "00d1aa","00a9eb","00bc78","00a957","00cfb7","00ebc3","00bcb2","#00ebc3"]] ,[[1, "0071bc","00a9eb","295caa","00a9eb","0089cf","0089cf","00a9eb","0099d1"]] ]; var tf = "<font unselectable=on color=#$c$>"; for (var i = 0; i < 4; i++) colorDat2.push(['_RFC'+dat[i][0][0], fGenHtml(dat[i], ( [ '<center style="font-size:12px;margin-top:-1;" para=_RFC$i$>', tf, 'A</font>', tf, 'B</font>', tf, 'C</font>', tf, 'D</font>', tf, 'a</font>', tf, 'b</font>', tf, 'c</font>', tf, 'd</font></center>' ].join( "" ) ).split("$")), 138, 136]); dat = [ //id,pLeft,pTop,width,menu dat,templ [ "mutb_"+gTBCmds[3],"0",gIsIE ? "3" : "0","116" ,[ [0, 0, 1] ,["宋体","宋体"] ,["黑体","黑体"] ,["楷体_GB2312","楷书"] ,["幼圆","幼圆"] ,["Arial","Arial"] ,["Arial Black","Arial Black"] ,["Times New Roman","Times New Roman"] ,["Verdana","Verdana"] ] ,[menuH, ' style="font:normal 12px $f$">$c$', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[4],"0",gIsIE ? "3" : "0","116" ,[ [0, 1, 2] ,[1,"xx-small;","小"] ,[2,"x-small;","中"] ,[4,"medium;","大"] ,[5,"large;line-height:28px;height:26px;","较大"] ,[6,"x-large;line-height:36px;height:34px;","最大"] ] ,[menuH, ' style="font-size:$s$">$c$', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[5],"0",gIsIE ? "3" : "0","150" ,colorDat2 ,[menuH, ' style="font-size:1px;width:$w$px;height:12px!important;height:14px;height:/**/14px;float:left;"><div unselectable="on" style="width:$w$px;height:10px!important;height:12px;height:/**/12px;background:#$c$;border:1px solid #a6a6a6;">$c$</div>', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[6],"0",gIsIE ? "3" : "0","150" ,colorDat ,[menuH, ' style="font-size:1px;width:12px!important;width:14px;width:/**/14px;height:12px!important;height:14px;height:/**/14px;float:left;"><div unselectable="on" style="width:10px!important;width:12px;width:/**/12px;height:10px!important;height:12px;height:/**/12px;background:#$c$;border:1px solid #a6a6a6;">&nbsp;</div>', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[7],"0",gIsIE ? "3" : "0","100" ,[ [0, 1, 2, 3, 4, 5] ,["justifyleft","100","20","-3px 0 0 0","&nbsp;左对齐","&nbsp;左对齐"] ,["justifycenter","120","20","-3px 0 0 0","&nbsp;居中对齐","&nbsp;居中对齐"] ,["Justifyright","140","20","-3px 0 0 0","&nbsp;右对齐","&nbsp;右对齐"] ] ,[menuH, '>', commHeadMenu, commTail, '$c$', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[8],"0",gIsIE ? "3" : "0","100" ,[ [0, 1, 2, 3, 4, 5] ,["insertorderedlist","160","20","-3px 0 0 0","&nbsp;数字编号","&nbsp;数字编号"] ,["insertunorderedlist","180","20","-3px 0 0 0","&nbsp;项目编号","&nbsp;项目编号"] ] ,[menuH, '>', commHeadMenu, commTail, '$c$', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[9],"0",gIsIE ? "3" : "0","100" ,[ [0, 1, 2, 3, 4, 5] ,["indent","220","20","-3px 0 0 0","&nbsp;向右缩进","&nbsp;向右缩进"] ,["outdent","200","20","-3px 0 0 0","&nbsp;向左缩进","&nbsp;向左缩进"] ] ,[menuH, '>', commHeadMenu, commTail, '$c$', menuT].join( "" ) ] ,[ "mutb_"+gTBCmds[10],"0",gIsIE ? "3" : "0","220" ,[ [0, 1, 2] ,["mutb_"+gTBCmds[10]+"_alert","padding:14px 0 10px 0;", "请先选择要加入链接的文字<div unselectable='on' style='margin:10px 0 0 0'><input type=button class='wd2 btn' value=重新选择></div>"] ,["mutb_"+gTBCmds[10]+"_prompt","padding:14px 0 10px 0;", "<div unselectable='on' style='margin:0 0 2px 5px;text-align:left;'>请输入链接的目标地址：</div><div unselectable='on'><input id='mutb_"+gTBCmds[10]+"_url' type=text style='width:200px;' class='txt' value='http://' /></div><div style='margin:2px 0 0 5px;font-size:11px;text-align:left;' class='addrtitle'>(例如: http://www.1715.cn/)</div><div unselectable='on' style='margin-top:5px;'><input id='mutb_"+gTBCmds[10]+"_ok' class='wd1 btn' type=button value=' 确定 '><input class='wd1 btn' type=button value=' 取消 '></div>"] ] ,"<div id='$id$' style='display:none;font:12px normal Verdana;width:100%;text-align:center;$s$' unselectable='on'>$c$</div>" ] ,[ "mutb_"+gTBCmds[11],"0",gIsIE ? "3" : "0","350" ,[ [0, 1, 2] ,["mutb_"+gTBCmds[11]+"_alert","