xhEditor及其代码高亮显示问题的解决

第一步,安装配置xhEditor

1、下载

直接去官网:http://xheditor.com/

2、安装

参见官网的manual:1. xhEditor入门基础 --》1.4. xhEditor基本使用指南》

 

 

第二步,安装配置prettify

下载,安装。参见官网

 

第三步,xhEditor + prettify

这是重点。

网上有文章说的很清楚(利用prettify为编辑器xhEditor添加代码高亮显示),但是,有个关键之处没讲到,所以,按文章去做,是没办法成功的!我试过N次,全部失败!

痛苦的很,没办法,去xhEditor官网看看吧。

2.5 插件开发指南

仔细看。

注意,其中提到了demo9。那就去看demo9的代码吧。

原来,那篇文章的js代码就是从这儿拿的!可为什么我原样copy也不行呢?!

把demo9代码存到本机,没问题!

删掉其它的test,仅保留prettify部分。demo9没问题。

把js和外部js文件链接部分的源代码,原样copy到我的代码里。不工作!

晕了!继续。有点恼羞成怒了。。。把</head>前全部换成demo9。不工作!

把textarea的id也换成一模一样。不工作!

该绝望了吧。。。

绝望中产生希望。再看textarea。

如果不采用插件,textarea的定义大概是这样的:

<textarea name="xh" id="xh"  class="xheditor"/>
</textarea>

再看看demo9是怎么写的:

<textarea id="elm1" name="elm1" rows="12" cols="80" style="width: 80%">
</textarea>

狗日的!居然没有了class!

原来,一旦写了class="xheditor",工具栏就被覆盖为默认的了。再或者,需要通过某些参数来改变默认工具栏?Anyway,至少,这么直不楞登的写上class=xheditor是肯定不行了。

郁闷的是,那篇网络文章没提。

更郁闷的是,官网也没提!

 

最后,交给我了。

posted @ 2012-02-29 22:36  tecfaq  阅读(589)  评论(1编辑  收藏  举报