FCKEditor装入模板方法

()里面的为说明，并不属于文件或者文件夹的名称

Assembly code 
xxxx(工程目录)
 |  
 |--fckeditor(编辑器的文件夹)
 |   |
 |   |--test.html(一个测试页面，使用加载模板函数的，代码在最后贴出)
 |   |--fcktemplates.xml(fck的模板配置文件)
 |   |__......其他的文件和文件夹，fck默认有的
 |
 |--你的其他文件和文件夹
 |
 |__test1.html(另一个测试页面)

在fckeditor目录下的test.html
HTML code 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>FCKeditor - Sample</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="robots" content="noindex, nofollow" />
    <link href="_samples/sample.css" rel="stylesheet" type="text/css" /><!--------注意路径------------>
    <script type="text/javascript" src="fckeditor.js"></script><!--------注意路径------------>
</head>
<body>
    <h1>
        FCKeditor - JavaScript - Sample 1
    </h1>
    <div>
        This sample displays a normal HTML form with an FCKeditor with full features enabled.
    </div>
    <hr />
    <form action="sampleposteddata.asp" method="post" target="_blank">
<script type="text/javascript">
function getHTML(o){
  var r="";
  for(var i=0;i<o.childNodes.length;i++)r+=o.childNodes[i].nodeValue;
  return r;
}
//Index:要加载的模板的索引号，从0开始
//url：模板xml的路径，相对当前页面
function ShowBo__LoadTemplates(Index,url)//使用ajax加载xml模板文件，防止google浏览器不支持当前通用的xml加载的方法从而不能在

google浏览器里初始化
{
   url+="?ts="+new Date().toString();
   var o;
   if(window.XMLHttpRequest)o=new XMLHttpRequest();
   else if(window.ActiveXObject)o=new ActiveXObject("microsoft.xmlhttp");
   else{ alert("浏览器不支持当前流行的ajax！");return "";}
   if(o){
     o.open('get',url,false);//同步     
     o.send(null)
     var dom=o.responseXML;
     var tmps=dom.getElementsByTagName("Html");//获取模板html 
     if(tmps.length==0)return "";//没有模板或者路径出错时则返回空
     if(Index>=tmps.length)Index=0;//索引号大于模板数量则默认第一个模板
     return document.all?tmps[Index].firstChild.nodeValue:getHTML(tmps[Index]);
   }
}

var tmpHtml=ShowBo__LoadTemplates(1,'fcktemplates.xml');//加载模板1====================和配置文件处在同一个目录
</script>
        <script type="text/javascript">
var sBasePath = document.location.pathname.substring(0,document.location.pathname.lastIndexOf('_samples')) ;

var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.BasePath    = sBasePath ;
oFCKeditor.Height    = 300 ;
oFCKeditor.Value    = tmpHtml;//设置模板
oFCKeditor.Create() ;
        </script>
        <br />
        <input type="submit" value="Submit" />
    </form>
</body>
</html>

xxxx下的test1.html
HTML code 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>FCKeditor - Sample</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <meta name="robots" content="noindex, nofollow" />
    <link href="fckeditor/_samples/sample.css" rel="stylesheet" type="text/css" /><!--------注意路径------------>
    <script type="text/javascript" src="fckeditor/fckeditor.js"></script><!--------注意路径------------>
</head>
<body>
    <h1>
        FCKeditor - JavaScript - Sample 1
    </h1>
    <div>
        This sample displays a normal HTML form with an FCKeditor with full features enabled.
    </div>
    <hr />
    <form action="sampleposteddata.asp" method="post" target="_blank">
<script type="text/javascript">
function getHTML(o){
  var r="";
  for(var i=0;i<o.childNodes.length;i++)r+=o.childNodes[i].nodeValue;
  return r;
}
//Index:要加载的模板的索引号，从0开始
//url：模板xml的路径，相对当前页面
function ShowBo__LoadTemplates(Index,url)//使用ajax加载xml模板文件，防止google浏览器不支持当前通用的xml加载的方法从而不能在

google浏览器里初始化
{
   url+="?ts="+new Date().toString();
   var o;
   if(window.XMLHttpRequest)o=new XMLHttpRequest();
   else if(window.ActiveXObject)o=new ActiveXObject("microsoft.xmlhttp");
   else{ alert("浏览器不支持当前流行的ajax！");return "";}
   if(o){
     o.open('get',url,false);//同步
     o.send(null)
     
     var dom=o.responseXML;
     var tmps=dom.getElementsByTagName("Html");//获取模板html 
     if(tmps.length==0)return "";//没有模板或者路径出错时则返回空
     if(Index>=tmps.length)Index=0;//索引号大于模板数量则默认第一个模板

     return document.all?tmps[Index].firstChild.nodeValue:getHTML(tmps[Index]);
   }

}

var tmpHtml=ShowBo__LoadTemplates(1,'fckeditor/fcktemplates.xml');//加载模板1=====================================

</script>
        <script type="text/javascript">
var sBasePath = "fckeditor/" ;//===========================注意设置这里的目录，是你当前目录相对与fckeditor目录的相对路径，最

后一个/不能少
var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.BasePath    = sBasePath ;
oFCKeditor.Height    = 300 ;
oFCKeditor.Value    = tmpHtml;//设置模板
oFCKeditor.Create() ;
        </script>
        <br />
        <input type="submit" value="Submit" />
    </form>
</body>
</html>
模板功能剖析
/测试工程/fckeditor/fcktemplates.xml
上面的文件就是模板功能文件，结构说明如下：
xml 代码
  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <Templates imagesBasePath="fck_template/images/">
  4. <!--上面节点：模板功能的起始根节点，并用来指明模板示意图的目录位置-->
  5. <!--比如上面已有的地址表明了我现在的模板图片文件所在位置是：\测试工程\fckeditor\editor\dialog\fck_template\images-->
  7. <Template title="验货报告表" image="template4.jpg">
  9. <!--上面节点：表示一个一个的不同模板，譬如我创建多组TEMPLATE节点，那么在显示的时候就会有多个模板可供使用编辑器的人选择-->
  10. <!--上面节点：另外2个属性分别表示模板提示名称和示例图文件名-->
  12. <Description>本模板是验货报告表的验货主题部分</Description>
  14. <!--上面节点：该模板的功能说明-->
  16. <!--下面节点：TABLE标签就是模板主体，就是这部分可以根据用户自由操作-->
  18. <Html>
  19. <![CDATA[
  20.     <table align="left"  cellspacing="0" cellpadding="0" width="98%" border="0">
  21.      <tbody>
  22.       <tr>
  23.        <td colspan="4" align="center">　</td>
  24.        <td align="center">&nbsp; </td>
  25.        <td align="center">&nbsp; </td>
  26.       </tr>
  27.      </tbody>
  28.     </table>
  29. ]]>
  30. </Html>
  31. </Template>
  32. </Templates>

另：

FCKeditor.net域名也已经转向至ckeditor.com了。据官方的解释，CK是对FCK的代码的完全重写，而且此项工作从2007年就开始了，并在今年初发表了多个测试版。至此，为大家服务长达6年的FCKeditor将被CKeditor替代。

 
【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/xyicheng/p/1644582.html