如何实现代码按钮来格式化文本区域中的文本？

Question

因此，我在博客上使用 StackOverflow 自己的 MarkdownSharp，我喜欢它。我现在想实现一个与此处的代码按钮完全相同的代码按钮。我似乎找不到单击该按钮时触发的 JavaScript，因为它都是缩小的且不是侵入性脚本。有人知道单击或按下 ctrl+k 时运行的代码吗？

这是一个屏幕截图，以防您不知道我指的是哪个按钮： http://www.codetunnel.com/codebutton.jpg

提前致谢！

更新

我复制了SO的wmd.js文件的源代码并未缩小它。然后我在记事本中搜索了某些关键文本。这个文件中的变量是无法理解的，更不用说阅读了，但我确实发现了这一点：

c.doCode = function (v, u) {
    var w = /\S[ ]*$/.test(v.before);
    var s = /^[ ]*\S/.test(v.after);
    if ((!s && !w) || /\n/.test(v.selection)) {
        v.before = v.before.replace(/[ ]{4}$/, function (x) {
            v.selection = x + v.selection;
            return ""
        });
        var t = 1;
        var r = 1;
        if (/\n(\t|[ ]{4,}).*\n$/.test(v.before)) {
            t = 0
        }
        if (/^\n(\t|[ ]{4,})/.test(v.after)) {
            r = 0
        }
        v.skipLines(t, r);
        if (!v.selection) {
            v.startTag = "    ";
            v.selection = "enter code here"
        } else {
            if (/^[ ]{0,3}\S/m.test(v.selection)) {
                v.selection = v.selection.replace(/^/gm, "    ")
            } else {
                v.selection = v.selection.replace(/^[ ]{4}/gm, "")
            }
        }
    } else {
        v.trimWhitespace();
        v.findTags(/`/, /`/);
        if (!v.startTag && !v.endTag) {
            v.startTag = v.endTag = "`";
            if (!v.selection) {
                v.selection = "enter code here"
            }
        } else {
            if (v.endTag && !v.startTag) {
                v.before += v.endTag;
                v.endTag = ""
            } else {
                v.startTag = v.endTag = ""
            }
        }
    }
};

当我意识到单击没有突出显示文本的按钮将文本“在此处输入代码”插入编辑器时，我发现了它。然后我搜索该文本并找到了该片段。有谁能做出正面或反面吗？

我什至不想要完整的编辑器，而只想要代码按钮。我可以不太关心其余的事情。

Answer 1

因此，经过多次搜索，我终于找到了完整的编辑器，包括评论等等。这是一项困难的侦探工作，但我成功了，现在我的网站有了一个完整的 WMD 编辑器。我在博客上记录了我的经历：

http: //www.CodeTunnel.com/blog/post/30/finding-and-implementing-the-wmd-editor

我计划将源代码上传到我自己的存储库并修改它以与通过加载的表单很好地配合阿贾克斯。

我想要的只是代码按钮，但事实证明这个编辑器非常简单，我喜欢它的大部分功能，所以我只是通过我在链接的博客文章中描述的一些小调整来实现整个事情。

为了回答我的具体问题，这里是代码按钮的片段：

command.doCode = function (chunk, postProcessing, useDefaultText) {

    var hasTextBefore = /\S[ ]*$/.test(chunk.before);
    var hasTextAfter = /^[ ]*\S/.test(chunk.after);

    // Use 'four space' markdown if the selection is on its own
    // line or is multiline.
    if ((!hasTextAfter && !hasTextBefore) || /\n/.test(chunk.selection)) {

        chunk.before = chunk.before.replace(/[ ]{4}$/,
            function (totalMatch) {
                chunk.selection = totalMatch + chunk.selection;
                return "";
            });

        var nLinesBefore = 1;
        var nLinesAfter = 1;


        if (/\n(\t|[ ]{4,}).*\n$/.test(chunk.before) || chunk.after === "") {
            nLinesBefore = 0;
        }
        if (/^\n(\t|[ ]{4,})/.test(chunk.after)) {
            nLinesAfter = 0; // This needs to happen on line 1
        }

        chunk.addBlankLines(nLinesBefore, nLinesAfter);

        if (!chunk.selection) {
            chunk.startTag = "    ";
            chunk.selection = useDefaultText ? "enter code here" : "";
        }
        else {
            if (/^[ ]{0,3}\S/m.test(chunk.selection)) {
                chunk.selection = chunk.selection.replace(/^/gm, "    ");
            }
            else {
                chunk.selection = chunk.selection.replace(/^[ ]{4}/gm, "");
            }
        }
    }
    else {
        // Use backticks (`) to delimit the code block.

        chunk.trimWhitespace();
        chunk.findTags(/`/, /`/);

        if (!chunk.startTag && !chunk.endTag) {
            chunk.startTag = chunk.endTag = "`";
            if (!chunk.selection) {
                chunk.selection = useDefaultText ? "enter code here" : "";
            }
        }
        else if (chunk.endTag && !chunk.startTag) {
            chunk.before += chunk.endTag;
            chunk.endTag = "";
        }
        else {
            chunk.startTag = chunk.endTag = "";
        }
    }
};

我不确定这个函数有多少依赖于文件中的其他代码，因为我没有花时间检查它，但它绝对是块执行代码按钮操作。

完成的控件

http://www.CodeTunnel.com/WMDEditor.jpg http ://www.CodeTunnel.com/WMDEditor.jpg