用geshi+ajax实现代码高亮--实现篇

首先,需要下载geshi,在http://qbnz.com/highlighter/,下载后解压上传到合适的位置(我的放在common目录里面,位置随意放,但要记住)。
其次,新增2个文件:(都位于common目录下,如果前面的geshi放到位置不一样,注意code.php的的include路径)
1、code.php--实现接收代码,用geshi处理并返回结果

parse_code();

?>

2、HiLightCode.asp--放入ajax代码,实现传送代码并回显代码处理结果(全是javascript代码)




最后,改动3个文件:
1、在ubbcode.asp中增加(大约位于259行左右)

re.Pattern = "\[code=(.[^\]]*)\](.*?)\[\/code\]"
Set strMatchs = re.Execute(strContent)
For Each strMatch in strMatchs
Dim lang,code,rnd_ID,rndID_t,rndID_c,Code_hi,Code_nm
lang=strMatch.SubMatches(0)
code=strMatch.SubMatches(1)
Randomize
rnd_ID = Int(100000 * Rnd)
rndID_t = "Type"& rnd_ID
rndID_c	=	"Code"& rnd_ID
Code_hi="

显示: 高亮"
Code_nm=" | 普通
" strContent = Replace(strContent,strMatch.Value,"
"""〈&""〈&" 代码

"&Code_hi & Code_nm &"

"&code&"
") NEXT

2、在pj根目录下的article.asp和default.asp文件中加入文件引用(加在最后的footer.asp前,否则会引起IE下边栏显示问题)

  
  

使用很简单,跟以前添加代码一样,只需注明代码类型就可以了,例如:
[code=asp][/code]

这只是粗略实现这个效果,具体可能有些地方还有待改进
HiLightCode.asp、ubbcode.asp、code.php三个文件打包下载
点击下载此文件

用ajax+geshi为pjblog实现代码高亮

一直想找个代码高亮的插件,都不是很满意。对于代码的着色方案,比较满意geshi,只不过是php的,用在pjblog上不是很方便。不过办法是有的,那就是用ajax实现。
原计划是用geshi通过ajax在生成缓存的时候,把代码着色。这样的话数据库里面存储的是原始代码,缓存文件里面的是着色后的代码,用UBB编辑器修改起来也方便,不过这种想法没有实现。后来就想,纯粹的用ajax实现代码着色。在生成缓存的过程中加入几个javascript代码,然后实现无刷新进行代码着色。
原始显示:
920081112221652.jpg
高亮显示:
v20081112221951.jpg