启用 CodeMirror Search/Replace 功能 about editor.md HOT 11 CLOSED

CodeMirror的替换功能replace是按Ctrl+shift+F / Command+Option+F，显示Replace对话框层，然后Enter，显示With对话框层填写要替换的，再回车，这时会提示YES or NO。

没有额外的配置项，只需要添加CodeMirror相应的模块文件和样式文件，下面这些文件：

<link rel="stylesheet" href="../lib/codemirror/addon/dialog/dialog.css">
<link rel="stylesheet" href="../lib/codemirror/addon/search/matchesonscrollbar.css">

CodeMirror Search/Replace Demo

添加上述模块文件后，第一次按Ctrl+F / Command+F，先显示CodeMirror的搜索对话框，再按一次Ctrl+F / Command+F会显示浏览器默认的。另外按Ctrl+G / Command+G也能启用CodeMirror的搜索功能，也可以用Ctrl+G / Command+G或者Ctrl+Shift+G / Command+Shift+G来切换各个搜索结果。

按Ctrl+shift+F / Command+Option+F只能一次替换一个，全部替换按Ctrl+Shift+R / Shift+Command+Option+F。

from editor.md.

@tylerlong 接受你的提议，打算列入下个大版本v1.2，作为新增的功能。不过要等段时间，先让v1.1.x能有尽可能的测试和修复Bug。

from editor.md.

v1.1.x系列版本启用搜索和替换功能的方法，需要拖动加载CodeMirror模块文件：

var testEditor = editormd("test-editormd", {
    width: "90%",
    height: 540,
    path : '../lib/',
    onload : function(){
        // Only load css files
        editormd.loadCSS("../lib/codemirror/addon/dialog/dialog");
        editormd.loadCSS("../lib/codemirror/addon/search/matchesonscrollbar");
    }
});

from editor.md.

我试了下，上面的方案可行。

有一些小问题（CodeMirror的问题，不过既然用了CodeMirror，也就继承了这些问题。）

• 搜索功能只能全部高亮，不能交互式挨个高亮
• 高亮后想取消高亮，只能再次打开搜索框
• 替换和全部替换，其实应该做成button，而不是靠快捷键来区分
• 默认不区分大小写，除非你写正则。 但是最终用户有多少是懂正则的？

整体感觉非常粗糙。仅仅是能用而已。当然这是CodeMirror addon的问题。需要调查下是否有更好用的addon，或者自己写一个难度有多大？

相比之下，ACE的搜索替换功能就相当赞： http://ace.c9.io/build/kitchen-sink.html

from editor.md.

暂时先用CodeMirror默认的解决方案，更好的解决方案再慢慢改进。
不过，这里找到了两个：

• https://github.com/ajaxorg/ace/tree/master/lib/ace/ext
• https://github.com/coderaiser/cm-searchbox

from editor.md.

v1.2 计划采用 cm-searchbox 这个插件来实现。

from editor.md.

整合 cm-searchbox 出了问题，看来得自己写一个了。

from editor.md.

cm-search 太新了，有问题很正常。

我刚才下载试用了下，确实有问题。

find 和 replace all工作正常， find all 和 replace 不能用。

from editor.md.

@tylerlong 嗯，v1.2 暂时还是采用CodeMirror默认的搜索Addon。

from editor.md.

@v1.2.0 support search / replace.

from editor.md.

https://github.com/coderaiser/cm-searchbox
已经使用了searchbox.js
直接输入alt+cmd+f，不能打开替换对话框。必须先用cmd+f打开搜索框，然后输入alt+cmd+f，才会切换到替换对话框。
那么为了能够直接打开替换对话框，做了如下修改
在searchbox.js中找到如下代码
CodeMirror.defineOption('searchbox', false, function(cm) {
}
然后增加cmd-alf-f的快捷键绑定
'Cmd-Alt-F': function() {
if (!Search){
Search = new SearchBox(cm);
}
Search.show(null,true);
}

那么现在你输入cmd-alt-f就可以直接打开对话框了

from editor.md.