使用KindEditor将Java代码存入数据库,然后将数据库的数据取出来并显示在页面上的时候,发现Java代码没有高亮显示。
加入的有关KindEditor相关的CSS 和 JS有:
- prettify.css
- kindeditor.js
- prettify.js
<link rel="stylesheet"
href="${pageContext.request.contextPath}/plugins/code/prettify.css" />
<script type="text/javascript" charset="utf-8"
src="${pageContext.request.contextPath}/kindeditor.js"></script>
<script type="text/javascript" charset="utf-8"
src="${pageContext.request.contextPath}/plugins/code/prettify.js"></script>
<script>
针对这个问题,一个解决方法是
增加一段JS代码来显示调用 prettyPrint()方法,代码如下:
<script>
KindEditor.ready(function(K) {
var editor = K.create('textarea[name="content"]', {
cssPath : '${pageContext.request.contextPath}/plugins/code/prettify.css',
resizeType: 1,
allowPreviewEmoticons: false,
allowImageUpload: false,
items: [
'code', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
'insertunorderedlist', '|', 'emoticons', 'image', 'link']
});
prettyPrint();
});
</script>
这样我们在页面上就能看到高亮的Java 代码段,效果图如下:
- 大小: 23.4 KB
- 大小: 24.5 KB
分享到:
相关推荐
本篇文章将详细介绍如何在KindEditor4.1.4版本中设置代码高亮显示。 首先,代码高亮显示,也就是Syntax Highlighting,是一种对代码或者文本显示的处理技术,使得代码或特定文本突出显示,通常通过不同颜色的背景、...
在IT领域,高亮显示插件是用于增强代码可读性和美观度的重要工具。这款名为“SimpleCodeHighLightPlugin”的插件,正如其标题所言,专注于提供一个简单且高效的代码高亮解决方案。它适用于那些希望在网页或编辑器中...
12. **代码高亮模式**:对于编程相关的文本编辑,提供代码高亮,提高可读性。 13. **Markdown模式**:支持Markdown语法,方便熟悉Markdown的用户快速编写文档。 14. **WYSIWYG模式**:即“所见即所得”模式,用户...
xheditor是一个所见即所得的Web文本编辑器,它具有代码高亮显示的功能,可以通过插件进行自定义扩展。所见即所得(WYSIWYG,即What You See Is What You Get)是一种编辑器的功能,它允许用户直接在编辑器界面中看到...
`plugins` 文件夹包含了编辑器的各种插件,这些插件扩展了编辑器的功能,例如图片处理、视频处理、表格工具、代码高亮等。在4.1.12版本中,可能有针对Flash上传图片和视频处理的新插件或者对现有插件进行了更新,以...
7. **样式和用户体验**:确保分页按钮有良好的视觉反馈,例如,当前页码高亮显示,鼠标悬停效果等。同时,考虑加载状态的提示,以提高用户体验。 在DEMO文件中,你应该能找到一个简单的示例应用,包括ASP脚本和...
7. **代码高亮**:对于程序员或技术类文章,KindEditor 支持代码高亮显示,提高阅读体验。 8. **兼容性良好**:与主流浏览器(如Chrome、Firefox、Safari、IE等)兼容,确保在各种环境下稳定运行。 9. **响应式设计*...
4. **代码高亮插件文件**(可选):`plugins/code/prettify.css` 和 `plugins/code/prettify.js` 这些文件通常位于kindEditor的根目录下,需要通过`<script>`和`<link>`标签引入到HTML页面中。例如: ```html ...
2. **代码编辑支持**:对于需要编辑HTML、CSS或JavaScript代码的用户,KindEditor通常会提供代码模式,允许用户直接编写和预览代码,同时具备代码高亮显示,提高代码可读性。 3. **多语言支持**:考虑到全球化的...
5. **代码高亮**:对于编程人员,可以插入代码片段并自动进行语法高亮显示。 6. **插件扩展**:KindEditor允许开发者自定义插件,以满足特定需求,如图库选择、地图插入等。 在实际应用中,我们可以通过JavaScript ...
4. **插件支持**: 它支持多种插件扩展,例如图片上传、视频插入、代码高亮等,增强了编辑器的功能性和灵活性。 5. **多语言支持**: 为了适应不同地区的用户,KindEditor 提供了多种语言包,包括中文、英文、日文等...
1. **KindEditor的基本使用**:KindEditor是一个JavaScript编写的富文本编辑器,它支持HTML5,提供多种功能,如图片上传、代码高亮、表格操作等。在网页上集成KindEditor,你需要引入相关的JS和CSS文件,并通过...
6. **代码高亮**:对于编程人员,KindEditor还支持代码高亮显示,方便在网页中展示源代码。 7. **拖拽功能**:支持图片、文件的拖拽上传,提高用户体验。 8. **HTML过滤**:为了防止XSS攻击,KindEditor提供HTML过滤...
6. **代码高亮**:对于插入的代码片段,KindEditor能进行语法高亮显示,便于代码阅读。 7. **兼容性好**:支持主流浏览器,如Chrome、Firefox、Safari、IE等,确保在各种环境下都能正常运行。 8. **API接口**:提供...
7. 扩展与插件:除了核心功能外,KindEditor社区还开发了许多插件,如公式编辑器、Markdown支持、代码高亮等,增强了编辑器的功能多样性。 8. 整合到项目:在Web应用中整合KindEditor时,需要注意与后端服务器的...
它的核心特性包括:文本格式化、插入图片、视频、表格、链接、代码高亮、撤销/重做、全屏编辑等。KindEditor通过AJAX与服务器进行交互,允许用户在客户端编辑内容,然后将数据提交到服务器端。 2. **富文本编辑器**...
5. **代码编辑**:对于技术类文章,KindEditor支持代码高亮显示,便于插入和编辑代码片段。 6. **多语言支持**:编辑器支持多种语言界面,包括中文,方便不同地区的用户使用。 7. **插件扩展**:KindEditor拥有...
7. **插件使用**:KindEditor有丰富的插件,如图床管理、代码高亮等,可以根据需要引入并配置。例如,如果需要代码高亮,可以使用`code`插件,添加到`items`数组中,并引入对应的CSS样式。 总的来说,KindEditor在...