Ace编辑器可以在代码旁边显示标签吗?

时间:2015-04-27 12:56:31

标签: javascript ace-editor

我试图在Ace Editor中显示有关代码行的一些信息。 因此,我想知道是否有可能在不是代码的实际部分的行的下方或上方添加信息标签。

例如,在JavaScript文件中,我们可以:

var x = "some string"; 作业表达

为"赋值表达式添加了一些额外的样式"文本; 但是,当文本保存时,我不想要"赋值表达式"成为内容的一部分。

我很想知道这是否可行。

2 个答案:

答案 0 :(得分:0)

在psuedo-class之后可能使用CSS?

.ace_line.foo:after {content: 'assignment expression';}

之类的东西

答案 1 :(得分:0)

您可以使用类名标记不同的代码行,例如将var x = "some string";类赋予“字符串赋值”。

要使用类标记文本,您可以创建自己的模式 - 荧光笔,继承您正在使用的任何语言。这是一个扩展c#

的示例
ace.define("ace/mode/custom_highlight_rules", ["require", "exports", "module", "ace/lib/oop", "ace/mode/text_highlight_rules", "ace/mode/behaviour/xml", "ace/mode/behaviour/cstyle"], function (require, exports, module) {
    "use strict";

    var oop = require("../lib/oop");
    var TextMode = require("../mode/text").Mode;
    var Tokenizer = require("../tokenizer").Tokenizer;
    var TextHighlightRules = require("./text_highlight_rules").TextHighlightRules;
    var CSharpHighlightRules = require("./csharp_highlight_rules").CSharpHighlightRules;

var Mode = function () {
    this.$tokenizer = new Tokenizer(new CustomHighlightRules().getRules());
}


var CusomHighlightRules = function() {
    this.embedRules(CSharpHighlightRules,
        "", [
            {
                token: "csharp.assignment",
                regex: "/[a-zA-A] *= *[a-zA-Z/

            },
            {
                token: "csharp.methodcall",
                regex: "/[a-zA-Z]+\(\)/

        ]);

这将使它标记所有与您添加的正则表达式匹配的代码 你选择的一类。

在这种情况下,uit会找到字母,然后是空格或否,等号和更多字母。并给它类csharp和ace_assignment(ace添加ace_)

之后你可以进入css并执行:在psuedo-classes或jquery lookups之后。

相关问题