CodeMirror中文說明文檔

文檔大綱

本文檔並未完全翻譯完成,我需要你的幫助。前往GitHub編輯

事件

CodeMirror 的大部分对象都会生成各种事件,来让客户端代码应对不同的情况。
需要用 onoff 函數來綁定或取消事件。
CodeMirror.signal(target, name, args...) 函數可以用來自定義事件,target 非 DOM 元素。

編輯器實例有以下事件,instance 參數爲編輯器實例:

"change" (instance: CodeMirror, changeObj: object)
編輯器的內容發生改變時觸發。
changeObj{from, to, text, removed, origin}
fromto:從哪裏修改到哪裏(修改前的坐標,比如 {ch:0, line:18} 表示从 19 行的行首开始修改)。
text:替換文本字符串數組(按行拆分的)。
removed:原文本字符串數組。
該事件在 operation 函数結束之前,更新 DOM 之前触发。
"changes" (instance: CodeMirror, changes: array<object>)
"change" 事件類似,但會把一個 operation 中的所有修改打包成數組。
該事件在 operation 完成后触发,应用 operation 中的修改时会生成新的 operation。
"beforeChange" (instance: CodeMirror, changeObj: object)
在應用修改前觸發,可用來調整修改內容或取消修改。
changeObj
fromtotext:與 "change" 一樣。
cancel():取消修改(undo 和 redo 产生的事件除外)。
update(from, to, text):调整修改内容(undo 和 redo 产生的事件除外),该函数的三个参数都是可选的。
注意!不能在 "beforeChange" 事件的处理函数中做任何影响編輯器内容的操作, 因为该事件是由編輯器底层产生的,这样做可能会使編輯器崩溃。
"cursorActivity" (instance: CodeMirror)
移動光標或選區時觸發,修改編輯器內容時觸發。
"keyHandled" (instance: CodeMirror, name: string, event: Event)
按鍵表中的按键被按下時觸發。
name:捕獲的按鍵名(如 "Ctrl-X")。
event:DOM 的 keydownkeypress 事件。
"inputRead" (instance: CodeMirror, changeObj: object)
讀取到輸入時觸發(輸入或粘貼)。
"electricInput" (instance: CodeMirror, line: integer)
当输入字符與 Mode 的 electric 匹配時觸發。
"beforeSelectionChange" (instance: CodeMirror, obj: {ranges, origin, update})
移動選區前觸發。
obj.ranges:由 {anchor, head} 組成的數組。
obj.origin:字符串,可選的。
obj.update:調整移動的位置。
"beforeChange" 相同,不能在該事件處理函數中修改編輯器的狀態。
"viewportChange" (instance: CodeMirror, from: number, to: number)
編輯器的可視區域改變時觸發(滾動、編輯等)。
fromto 是新的可視區域的开始和結束位置。
"swapDoc" (instance: CodeMirror, oldDoc: Doc)
使用 swapDoc 函数更换編輯器的内容对象時觸發。
"gutterClick" (instance: CodeMirror, line: integer, gutter: string, clickEvent: Event)
点击編輯器的侧边栏時觸發。
line:行号(从 0 开始)。
gutter:点击的侧边栏的 CSS 样式名。
clickEventmousedown 事件。
"gutterContextMenu" (instance: CodeMirror, line: integer, gutter: string, contextMenu: Event: Event)
在編輯器的侧边栏上点击鼠标右键时触发(菜单键)。
line:行号(从 0 开始)。
gutter:点击的侧边栏的 CSS 样式名。
contextMenucontextmenu 事件,可以使用 preventDefault 來終止對該事件的響應。
"focus" (instance: CodeMirror, event: Event)
編輯器獲得焦點時觸發。
"blur" (instance: CodeMirror, event: Event)
編輯器失去焦點時觸發。
"scroll" (instance: CodeMirror)
滾動編輯器內容時觸發。
"refresh" (instance: CodeMirror)
編輯器刷新調整大小后触发。 主要用来清除依赖于編輯器或字符数的变量。
"optionChange" (instance: CodeMirror, option: string)
setOption 函數被調用後觸發。
"scrollCursorIntoView" (instance: CodeMirror, event: Event)
編輯器尝试把可视范围滚动到光标处時觸發。
借助该事件可以让其他内容跟随編輯器滚动。
"update" (instance: CodeMirror)
更新 DOM 時觸發。
"renderLine" (instance: CodeMirror, line: LineHandle, element: Element)
把一行的内容渲染为 DOM 時觸發。
更具体的,构造 DOM 元素后,添加到文档之前時觸發。
可以在该事件的处理函数中修改 DOM 元素的样式或为其绑定事件,但不能修改編輯器的状态。
"mousedown", "dblclick", "touchstart", "contextmenu", "keydown", "keypress", "keyup", "cut", "copy", "paste", "dragstart", "dragenter", "dragover", "dragleave", "drop" (instance: CodeMirror, event: Event)
这些 DOM 事件触发時觸發。
可以使用 preventDefault 來終止對這些事件的響應。

內容對象(CodeMirror.Doc)有以下事件:

"change" (doc: CodeMirror.Doc, changeObj: object)
修改内容時觸發。changeObj 参数與編輯器实例的 "change" 事件的參數一致。
"beforeChange" (doc: CodeMirror.Doc, change: object)
参考編輯器实例的 "beforeChange" 事件。
"cursorActivity" (doc: CodeMirror.Doc)
移动光标或改变选区時觸發。
"beforeSelectionChange" (doc: CodeMirror.Doc, selection: {head, anchor})
参考編輯器实例的 "beforeSelectionChange" 事件。

行對象(例如 getLineHandle 函數的返回值)有以下事件:

"delete" ()
删除行对象時觸發。
一般用來確定某行的側邊欄標記何時被刪除。
"change" (line: LineHandle, changeObj: object)
修改某行的內容時觸發(行對象並未被刪除)。
changeObj 参数與編輯器实例的 "change" 事件的參數一致。

文本標記對象(CodeMirror.TextMarkermarkText 函數和 setBookmark 函數的返回值)有以下事件:

"beforeCursorEnter" ()
光标进入标记范围時觸發。
不能在该事件的处理函数中修改編輯器的状态,但可以删除触发该事件的标记。
"clear" (from: {line, ch}, to: {line, ch})
删除标记時觸發。
如果啓用了 clearOnEnter ,在光标进入标记范围時觸發。
調用文本標記對象的 clear() 函數觸發。
注意:通過輸入來刪除標記時不會觸發該事件,因爲撤銷操作可以使標記還原。
fromto 是標記的起止位置。
"hide" ()
通过输入删除标记的最后一个字符時觸發。
"unhide" ()
通过输入删除标记后,又通过撤销还原标记時觸發。

行內小部件對象(CodeMirror.LineWidgetaddLineWidget 函數的返回值)有以下事件:

"redraw" ()
增加新的小部件時觸發。
滚出可視區域后又滚回可視區域時觸發。
更新編輯器配置時觸發。
所在行要求重绘時觸發。