一入PHP岁月催

改版中...

CodeMirror教程,CodeMirrorAPI中文信息

<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         }
posted @ 2014-10-31 16:38  一入PHP岁月催  阅读(21902)  评论(1编辑  收藏  举报