CodeMirror 使用大全
来源:互联网 发布:光环新网 云计算牌照 编辑:程序博客网 时间:2024/05/22 03:13
CodeMirror 使用大全
CodeMirror是一个用于编辑器文本框textarea代码高亮javascript插件,为各种编程语言实现关键字,函数,变量等代码高亮显示,丰富的api和可扩展功能以及多个主题样式,能满足您各种项目的需求。
CodeMirror支持大量语言的语法高亮,包括C、C++、C#、Java、Perl、PHP、JavaScript、Python、Lua、Go、Groovy、Ruby等,以及diff、LaTeX、SQL、wiki、Markdown等文件格式。此外,CodeMirror还支持代码自动完成、搜索/替换、HTML预览、行号、选择/搜索结果高亮、可视化tab、Emacs/VIM键绑定、代码自动格式等。
CodeMirror采用MIT开源许可协议,目前已经被集成到各种应用程序中,如Adobe Brackets、CoDev、Light Table等开发环境,还被作为各种SQL、Haxe、JavaScript在线编辑器的基础库来使用。
CodeMirror开发者近日发布了3.0版本。该版本进行了一些改进,如果你使用之前的版本,则需要注意,3.0中的API与2.0存在一些不兼容的问题,详细信息见升级向导。此外,重要的是,3.0放弃了对IE7的支持。
使用方法
本文将做简单的介绍,如何使用CodeMirror插件和提交表单。
引入核心文件
- <link rel="stylesheet" href="lib/codemirror.css">
- <script src="lib/codemirror.js"></script>
codemirror.css和codemirror.js文件是CodeMirror插件的核心文件,无论你要高亮的代码是何种语言,都要引入这两个文件。
引入代码高亮js
接下来要引入的文件可以根据您的项目需求引入,不必要引入所有文件,比如您要显示html代码,则引入:
- <script src="xml.js"></script>
代码调用
- <script>
- myTextarea = document.getElementById("code");
- var editor = CodeMirror.fromTextArea(myTextarea, {
- mode: "text/html"
- });
- </script>
myTextarea为您的编辑器dom元素ID,一般使用document.getElementById(“code”)方法获取文本框,如果您使用的jquery,那么需要在代码后面加入[0],比如$(‘#code’)[0];
获取Codemirror的值
- //该方法得到的结果是经过转义的数据
- editor.getValue();
- //该方法得到的结果是未经过转义的数据
- editor.toTextArea();
- editor.getTextArea().value;
如果是通过 JS 进行表单提交,可以在提交的 JS 代码中这样使用:
- //将 Codemirror 的内容赋值给 Textarea
- $("#content").text(editor.getValue());
Codemirror赋值
1.editor.setValue('为codemirror赋值');
Codemirror Events change事件
主要代码
Editor.on("change", function (Editor, changes) {
while (changes) {
Editor1.replaceRange(changes.text.join("\n"), changes.from, changes.to);
changes = changes.next;
}
});
changes.next
不是每次change事件都会有
项目地址:http://codemirror.net/
在线使用手册:http://codemirror.net/doc/manual.html
github地址:https://github.com/marijnh/codemirror
原文地址:http://www.cnblogs.com/onlyonely/p/4450029.html
- CodeMirror 使用大全
- codeMirror 使用教程
- codeMirror插件使用
- CodeMirror简单使用
- CodeMirror的认识和使用
- 在线代码编辑器 CodeMirror 使用简介
- 使用codemirror对xml进行高亮显示
- CodeMirror与jquery UI-Tabs混合使用 注意事项
- 使用 CodeMirror 打造属于自己的在线代码编辑器
- 使用 CodeMirror 打造属于自己的在线代码编辑器
- CodeMirror使用手册
- codeMirror配置
- codemirror sql
- codemirror 笔记
- vue-codemirror
- 使用CodeMirror实现在线velocity语法高亮和自动联想功能
- CodeMirror动态显示
- 2015.6.25(CodeMirror插件)
- Java程序设计基础
- pwd 获取用户信息, grp 获取组的信息
- Spring+Quartz实现定时任务的配置方法
- Hive入门培训
- UVA 120 - Stacks of Flapjacks(构造)
- CodeMirror 使用大全
- python 判读某天是星期几 - time 格式
- iOS开发使用的证书和文件有哪些?
- 每天一个Linux命令(2)- find
- 几种常见的博弈模型
- Myeclise SVN
- python程序的调试方法
- 最详细的Log4j使用教程
- iOS UI调试神器,插件injection for Xcode使用方法