放置请求后ACE编辑器呈现错误

Question

我在更新对象字段的'put'请求后遇到ACE编辑器问题（使用django rest framework，它使用Ajax Form进行PUT / PATCH / DELETE / OPTIONS方法）

我目前正在隐藏表单中的textarea并替换为ace编辑器，在更改时使用编辑器的内容更新textarea。

但是，在发布时 - 会发生以下情况

变为

我不确定最新情况。可能是ace / css / ace_editor.css没有加载，但我不确定为什么会这样......

非常感谢任何帮助！

     $(function () {
              $('textarea[name=SQL]').each(function () {            

                  console.log('new editor');


                  $('form').find('textarea[name=SQL]').attr('id','textarea-code');
                  $('#textarea-code').parent().append('<div id="ace-editor" class="ace-editor-class" style="height: auto;min-height:100px"></div>');


                  var editor = ace.edit("ace-editor");

                  editor.setTheme("ace/theme/crimson_editor");

                  editor.getSession().setMode("ace/mode/sql");


                  var textarea = $('#textarea-code').css('display', 'none');

                  editor.getSession().setValue(textarea.val());


                  editor.getSession().on('change', function(){
                    textarea.val(editor.getSession().getValue());

                    editor.resize(true);

                  });
              });
            });

Answer 1

临时解决方案： 编辑似乎缺少一些重要的CSS（.ace_editor）。解决方案是复制ace.js的行14388：

var editorCss = ".ace_editor {\ ...

进入本地css文件（首先删除所有\。）。