ueditor 代码高亮 - 基本调用
Hello!
如果觉得不错的话,并且不吝转载时,请顺便添加上这篇文章的链接
http://www.hi-ruby.com/posts/1012
hi-ruby这回重写,后台使用了一直想使用的ueditor, 之前公司用的在ie下弹出层有问题就拿下了,这回就不考虑ie的问题了
ueditor自带代码高亮的功能,但是前台还需要自己写入, 其实灰常简单,按照ueditor的说明做下去就ok了
说明就在ueditor压缩包里_examples/highlightDemo.html中
导入包:
<!--加入高亮的js和css文件,如果你的编辑器和展示也是一个页面那么高亮的js可以不加载--> <script type="text/javascript" charset="utf-8" src="../third-party/SyntaxHighlighter/shCore.js"></script> <link rel="stylesheet" type="text/css" href="../third-party/SyntaxHighlighter/shCoreDefault.css"/>
在页面调用一下js代码如下:
//为了在编辑器之外能展示高亮代码 SyntaxHighlighter.highlight(); //调整左右对齐 for(var i=0,di;di=SyntaxHighlighter.highlightContainers[i++];){ var tds = di.getElementsByTagName('td'); for(var j=0,li,ri;li=tds[0].childNodes[j];j++){ ri = tds[1].firstChild.childNodes[j]; ri.style.height = li.style.height = ri.offsetHeight + 'px'; } }