xhEditor及其代码高亮显示问题的解决
第一步,安装配置xhEditor
1、下载
直接去官网:http://xheditor.com/
2、安装
参见官网的manual:1. xhEditor入门基础 --》1.4. xhEditor基本使用指南》
第二步,安装配置prettify
下载,安装。参见官网
第三步,xhEditor + prettify
这是重点。
网上有文章说的很清楚(利用prettify为编辑器xhEditor添加代码高亮显示),但是,有个关键之处没讲到,所以,按文章去做,是没办法成功的!我试过N次,全部失败!
痛苦的很,没办法,去xhEditor官网看看吧。
仔细看。
注意,其中提到了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是肯定不行了。
郁闷的是,那篇网络文章没提。
更郁闷的是,官网也没提!
最后,交给我了。