javascript-Ace编辑器不适用于引导程序

我使用boostrap默认示例主题：http://getbootstrap.com/examples/jumbotron-narrow/

而且我想过去使用ace编辑器而不是中央块,但是ace编辑器不起作用(空白)：

...
<div class="container-narrow">
  <div class="masthead">
    <ul class="nav nav-pills pull-right">
      <li class="active"><a href="#">Home</a></li>
    </ul>
    <h2 class="muted">Title</h2>
  </div>
  <hr>
  <textarea name="text" style="display: none;"></textarea>
  <div id="editor">Text</div>
  <hr>
  <div class="footer">
    <p>&copy; SiteName</p>
  </div>
</div> <!-- /container -->

<script src="style/ace/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
  var editor = ace.edit("editor");
  editor.setTheme("ace/theme/xcode");
  editor.getSession().setMode("ace/mode/c_cpp");
</script>
...

我究竟做错了什么？

解决方法:

要测试出了什么问题：

>检查Ace是否已将其他div添加到< div id =“ editor”>中,如果没有,则控制台中一定存在js错误.
>如果Ace存在但不可见,请从< div id =“ editor”>中删除所有文本.并在ace.edit行中注释掉以查看ace的尺寸(ace尝试匹配该div的高度)
>如果问题确实是Ace获得height = 0,则可以在编辑器div中添加明确的高度,
>,或者如果您希望它适合文本,请设置maxLines和minLines选项,如https://github.com/ajaxorg/ace-builds/blob/v1.1.6/demo/autoresize.html#L41-L43所示,但是建议不要将maxLines设置得太大,因为它会禁用仅绘制可见文本的优化,并且会使大型文档的编辑器变慢.

标签：ace-editor,javascript,css,twitter-bootstrap
来源： https://codeday.me/bug/20191011/1893098.html