Ace Code Editor автозавершение не работает

Question

У меня есть текстовое поле, которое превращается в редактор кодов в браузере. В основном это просто имитирует textarea для div, а затем получает значение для submit.

Авто завершение не работает. Это мой сценарий:

$(function() { 
    $('textarea[data-editor]').each(function() { 
    var textarea = $(this); 
    var mode = textarea.data('editor'); 
    var editDiv = $('<div>', { 
     position: 'absolute', 
     height: textarea.height(), 
     'class': textarea.attr('class') 
    }).insertBefore(textarea); 
    textarea.css('display', 'none'); 
    var editor = ace.edit(editDiv[0]);   
    editor.getSession().setValue(textarea.val()); 
    editor.getSession().setMode("ace/mode/" + mode); 
    // enable autocompletion and snippets 
    ace.require("ace/ext/language_tools"); 
    editor.setOptions({ 
     enableSnippets: true, 
     enableBasicAutocompletion: true, 
     enableEmmet: true 
    }); 
     // editor.setTheme("ace/theme/idle_fingers"); 
     editor.getSession().setUseWorker(false); 
     editor.session.setFoldStyle('manual'); 
     editor.setShowPrintMargin(false); 
     // copy back to textarea on form submit... 
     textarea.closest('form').submit(function() { 
      textarea.val(editor.getSession().getValue()); 
     }) 
     }); 
}); 

Если я удалить все внутри $('textarea[data-editor]').each(function() { и просто запустить

ace.require("ace/ext/language_tools"); 
    editor.setOptions({ 
     enableSnippets: true, 
     enableBasicAutocompletion: true, 
     enableEmmet: true 
    }); 

он работает отлично. Что я делаю не так?

Answer 1

Возможно, вы устанавливаете неправильный режим, который не имеет никаких завершений. версия ниже работает

$(function() { 
 
    $('textarea[data-editor]').each(function() { 
 
    var textarea = $(this); 
 
    var mode = textarea.data('editor'); 
 
    var editDiv = $('<div>', { 
 
     position: 'absolute', 
 
     height: textarea.height(), 
 
     'class': textarea.attr('class') 
 
    }).insertBefore(textarea); 
 
    textarea.css('display', 'none'); 
 
    var editor = ace.edit(editDiv[0]); 
 
    editor.session.setValue(textarea.val()); 
 
    editor.session.setMode("ace/mode/" + mode); 
 
    
 
    // enable autocompletion and snippets 
 
    ace.require("ace/ext/language_tools"); 
 
    editor.setOptions({ 
 
     enableSnippets: true, 
 
     enableBasicAutocompletion: true, 
 
     enableEmmet: true, 
 
     useWorker: false, 
 
     theme: "ace/theme/idle_fingers", 
 
     showPrintMargin: false, 
 
     showFoldWidgets: false 
 
    }); 
 
    // copy back to textarea on form submit... 
 
    textarea.closest('form').submit(function() { 
 
     textarea.val(editor.getSession().getValue()); 
 
    }) 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajaxorg.github.io/ace-builds/src/ace.js"></script> 
 
<script src="https://ajaxorg.github.io/ace-builds/src/ext-language_tools.js"></script> 
 
<script src="https://ajaxorg.github.io/ace-builds/src/ext-emmet.js"></script> 
 

 

 
<form> 
 
    <textarea data-editor='javascript' rows="10">{ 
 
}</textarea> 
 
    <input type="submit" value="Submit"> 
 
</form>