[英]Ace editor doesn't work with bootstrap
I use boostrap default example theme: http://getbootstrap.com/examples/jumbotron-narrow/我使用 boostrap 默认示例主题: http ://getbootstrap.com/examples/jumbotron-narrow/
and i'd like to past ace editor instead central block, but ace editor doesn't work (empty space):我想过去 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>© 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>
...
What am I doing wrong?我究竟做错了什么?
Ace should work fine with Bootstrap. Ace 应该可以与 Bootstrap 一起正常工作。 Make sure you've included the appropriate ACE js scripts and set an specific height for it's container.
确保您已包含适当的 ACE js 脚本并为其容器设置特定高度。
Ace Bootstrap Example Ace Bootstrap 示例
https://codeply.com/p/hytEdNhVOV https://codeply.com/p/hytEdNhVOV
To test what goes wrong:要测试哪里出了问题:
<div id="editor">
, if no, there must be some js error in console.<div id="editor">
添加了其他 div,如果没有,则控制台中肯定存在一些 js 错误。<div id="editor">
and comment out ace.edit
line to see what size ace will get (ace tries to match height of that div)<div id="editor">
删除所有文本并注释掉ace.edit
行以查看 ace 将获得的大小(ace 尝试匹配该 div 的高度)maxLines
and minLines
options as shown in https://github.com/ajaxorg/ace-builds/blob/v1.1.6/demo/autoresize.html#L41-L43 , however setting maxLines very large isn't recomended since it disables optimization of drawing only visible text, and can make editor slow for large documents.maxLines
和minLines
选项,如https://github.com/ajaxorg/ace-builds/blob/v1.1.6/demo/autoresize.html#L41-L43所示,但是设置不推荐 maxLines 非常大,因为它禁用仅绘制可见文本的优化,并且会使编辑器对大型文档变慢。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.