Javascript 更改codemirror中TextArea的高度和宽度
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12349529/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Change Height and Width of TextArea in codemirror
提问by selva_pollachi
I am developing website which having xml, java programs. So i chose CodeMirror for displaying programs in TextArea. I had successfully displayed. It's default heightis 300pxin codemirror.css. How to change Height and Width of TextArea programmatically in codemirror?
我正在开发具有 xml、java 程序的网站。所以我选择了 CodeMirror 在 TextArea 中显示程序。我已经成功显示了。它的默认height值300px在codemirror.css. 如何在代码镜像中以编程方式更改 TextArea 的高度和宽度?
回答by Christian
The CodeMirror user manual is your friend.
Example code:
示例代码:
<textarea id="myText" rows="4" cols="10"></textarea>
<script type="text/javascript" language="javascript">
var myTextArea = document.getElementById('myText');
var myCodeMirror = CodeMirror.fromTextArea(myTextArea);
myCodeMirror.setSize(500, 300);
</script>
回答by YourAboutMeIsBlank
myCodeMirror.setSize(null, 500);
You can pass null for either of them to indicate that that dimension should not be changed.
您可以为它们中的任何一个传递 null 以指示不应更改该维度。
cm.setSize(width: number|string, height: number|string)
Programmatically set the size of the editor (overriding the applicable CSS rules). width and height can be either numbers (interpreted as pixels) or CSS units ("100%", for example). You can pass null for either of them to indicate that that dimension should not be changed.
以编程方式设置编辑器的大小(覆盖适用的 CSS 规则)。宽度和高度可以是数字(解释为像素)或 CSS 单位(例如“100%”)。您可以为它们中的任何一个传递 null 以指示不应更改该维度。
回答by KhoPhi
Although the answer from Christian is great, just a heads up:
尽管 Christian 的回答很棒,但请注意:
Autoresize Demo.
自动调整演示。
.CodeMirror {
border: 1px solid #eee;
height: auto;
}
By setting an editor's
heightstyle toautoand giving theviewportMargina value ofInfinity, CodeMirror can be made to automatically resize to fit its content.
通过将编辑器的
height样式设置为auto并赋予viewportMargin值Infinity,可以使 CodeMirror 自动调整大小以适应其内容。
回答by pme
As an extention to the correct answer:
作为正确答案的延伸:
If you want that it takes the whole size of the Parent element, you can use:
如果您希望它占用 Parent 元素的整个大小,您可以使用:
myCodeMirror.setSize("100%", "100%");
myCodeMirror.setSize("100%", "100%");

