< html > < head > < link rel ="stylesheet" href ="codemirror.css" > <!-- 引入CSS文件 --> < script src ="codemirror.js" ></ script > <!-- 引入JS文件 --> </ head > < body > < textarea id ="code" name ="code" >http://www.cnblogs.com/oldphper </ textarea > < script > var editor = CodeMirror.fromTextArea(document.getElementById("code"), { // 标识到textarea value : "http://www.cnblogs.com/oldphper", // 文本域默认显示的文本 mode : "text/html", // 模式 // theme : "", // CSS样式选择 indentUnit : 2, // 缩进单位，默认2 smartIndent : true, // 是否智能缩进 tabSize : 4, // Tab缩进，默认4 readOnly : false, // 是否只读，默认false showCursorWhenSelecting : true, lineNumbers : true // 是否显示行号 // .. 还有好多，翻译不完。需要的去看http://codemirror.net/doc/manual.html#config }); </ script > </ body > </ html >
API 部分信息。一个一个测试出来的。
1 function fun() { 2 ob = ""; 3 // alert(editor.getValue()); // 得到所有内容 4 // editor.setValue("abc"); // 将编辑器内容改为"abc" 5 6 // 0为起点，2行第3个字母到2行第5个字母 7 // alert(editor.getRange({line:1,ch:2},{line:1,ch:5})); //得到 8 // editor.replaceRange("shashasha",{line:1,ch:2},{line:2,ch:5}); 9 10 // alert(editor.getLine(2)); // 第三行数据 11 // alert(editor.lineCount()); // 总共几行 12 // alert(editor.firstLine()); // 首行数0 13 // alert(editor.lastLine()); // 末行数19，共20行 14 // ob = editor.getLineHandle(1); // 第二行数据句柄 15 // alert(editor.getLineNumber(ob)); // 行句柄在哪行 16 // editor.eachLine(0,2,alert(ob)); 17 18 // ob = editor.changeGeneration(); // 编辑动作次数，1次起 19 // editor.markClean(); // 清除动作 20 // editor.isClearn(); // 是否清除 21 22 // ob = editor.getSelection(); // 获得选中的数据一条 23 // ob = editor.getSelections(); // 获得选中数据多条 24 editor.replaceSelection("ttttttt"); // 选中替换，一条根多条都替换，不选中则在光标处插入 25 // editor.replaceSelections(["aaa","bbb"]); // 选中替换，多条对多选 26 // editor.setSelection(); //设置选中 27 // editor.setSelections(); //设置选中 28 // ob = editor.listSelections(); //boj 29 // ob = editor.somethingSelected(); // 是否有选中 30 // editor.addSelection({line:2,ch:6}, {line:1,ch:2}); // 选中此段 31 32 // ob = editor.getCursor(); // ob['line']、['ch'] 33 // editor.setCursor(2); // 设置光标位置 34 35 // ob = editor.hasFocus(); // focus?全false 36 37 // editor.addOverlay("aaaaa"); //.. 38 // editor.removeOverlay("aaaaa"); //.. 39 40 // ob = editor.getDoc(); // 文档对象,很多 41 // ob = editor.getEditor(); //.. 42 43 // ob = editor.setBookmark({line:1,ch:3}); // 书签对象 44 45 // editor.addWidget({line:1,ch:2},"<if></if>",true); //添加部件 46 47 // editor.setSize(1100,1100); //设置宽高 48 // editor.scrollTo(800,300); // 设置滚动条位置 49 50 // editor.cursorCoords({line:1,ch:2},"aaaaaa"); //.. 51 52 // for (var i in ob) 53 // alert(i); 54 // alert(ob); 55 }