Question

我正在做一个网页，将mySQL查询保存在表格中。每行都有一个带有查询行的ACE CODE EDITOR。首先，我在每一行上启动de ACE CODE EDITOR，然后隐藏它。稍后，当我点击一个按钮时，所有编辑器都变得可见且不可编辑。重要的是包含ACE的div必须具有最小大小。

当我第一次点击de ACE CODE EDITOR时，它上面的文字会自动隐藏到左侧。当您使用键盘键向左移动光标时，它会再次出现。

这是de HTML代码和JQUERY。

<div class="div-consulta">
    <div id='tab_consulta_1">
        SELECT * FROM table
    </div>

    <div id='tab_comentarios_1">
      <p>Observation about the query</p> 
    </div>
</div>

和JQUERY

//Function to start editor
AceEditor.iniciaEditor=function(div_cargar,texto){
    var id_div=$(div_cargar).attr('id');
    var editor = ace.edit(id_div);

    var tamano_fuente=15; //font size
    var num_lineas_editor=editor.session.getLength(); //lines
    var padding=10;
    var editor_total_height=(padding*2)+(tamano_fuente*num_lineas_editor);

    editor.$blockScrolling = Infinity;
    editor.setTheme("ace/theme/monokai");
    editor.session.setMode("ace/mode/mysql");
    editor.setShowPrintMargin(false);
    editor.setFontSize(tamano_fuente);
    editor.setOptions({maxLines: Infinity}); //So many lines as the document
    editor.setValue(texto.trim(),-1); //Set cursor to the begining
    $(div_cargar).css("height",editor_total_height);
    return editor;
};

//To resize when the div is back from hide
AceEditor.resize=function(div){
    var id_div=$(div).attr('id');
    var editor=ace.edit(id_div);
    editor.resize();
};

首次单击时隐藏Ace代码编辑器文本

0 个答案: