如何在webix应用程序的codemirror编辑器中向下滚动到找到并突出显示的模式的位置

时间:2017-04-22 15:31:22

标签: javascript codemirror webix

在我的Webix应用程序中,我嵌入了一个codemirror-editor来编写JavaScript。当我使用浏览器的Ctrl + F或其他任何方式进行搜索时,有没有办法向上滚动到找到并突出显示的图案的位置?

我从http://codemirror.net/doc/manual.html#addon_search

了解了一个附加搜索/ jump-to-line.js

以及以下实现此目的的方法(cm是代码镜像引用):

cm.scrollIntoView(what: {line, ch}|{left, top, right, bottom}|{from, to}|null, ?margin: number)

但是,不太确定如何使用它们。我包含了我在下面编写的代码片段以及它的代码段链接。

代码段链接:http://webix.com/snippet/7acca905

代码如下:

webix.codebase = "http://cdn.webix.com/components/codemirror/";
var editor1 = {
id: "editor1",
view: "codemirror-editor",
mode: "javascript",
value: "",
height: 200
};

var editor2 = {
id: "editor2",
view: "codemirror-editor",
mode: "javascript",
value: "",
height: 200

};

var ed1 = {id:"editor1",  value: "Editor-I" };
var ed2 = {id:"editor2",  value: "Editor-II" };

var op = [ed1, ed2];

var views = {
animate: false,
cells: [ 
editor1, editor2
]
}; 

webix.ui({
    container: "mydiv",
    rows: [
    {view: "tabbar", 
    id: "tabview",
    options:op,
    multiview:{ keepViews:true }

  },
  views,
 {height: 300},

]
});

与之关联的HTML部分:

<script type="text/javascript" src="http://cdn.webix.com/components/codemirror/codemirror.js"></script>
<div id = "mydiv" style="margin-top:30px;"></div>

任何帮助都会很棒。感谢。

1 个答案:

答案 0 :(得分:1)

您可以获得类似

的codemirror对象
var cm = $$("editor1").getEditor();

不幸的是,似乎cdn.webix.com的代码镜像版已经过时,并且不支持scrollIntoView API