Javascript 我如何从 ACE 编辑器中获取价值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8963855/
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
How do I get value from ACE editor?
提问by ShankarSangoli
I am using ACEeditor for the first time. I have the below questions related to it.
我ACE第一次使用编辑器。我有以下相关问题。
How do I find the instance of
ACEeditor on the page? I don't want to maintain a global variable which will hold the editor instance. I need to find its instance on demand.How to get and set its value?
如何
ACE在页面上找到编辑器的实例？我不想维护一个全局变量来保存编辑器实例。我需要按需找到它的实例。如何获取和设置它的值？
I am open for suggestions for any better editor than ACEeditor which will support almost all types of language/markup/css etc and highly integrated with jQuery.
我愿意为任何比ACE编辑器更好的编辑器提供建议，这些编辑器将支持几乎所有类型的语言/标记/css 等，并与jQuery.
回答by Mrchief
Per their API:
根据他们的API：
Markup:
标记：
<div id="aceEditor" style="height: 500px; width: 500px">some text</div>
Finding an instance:
查找实例：
var editor = ace.edit("aceEditor");
Getting/Setting Values:
获取/设置值：
var code = editor.getValue();
editor.setValue("new code here");
Based on my experience, Ace is the best code editor I've seen. There are few others such as CodeMirroretc. but I found them to be less useful or difficult to integrate than Ace.
根据我的经验，Ace 是我见过的最好的代码编辑器。很少有其他的，例如CodeMirror等，但我发现它们不如 Ace 有用或难以集成。
Here's a Wiki page for comparision of such editors.
There is a paid one also which I haven't tried (and I can't remember for now). Will updated later if I can find it.
还有一个付费的，我还没有尝试过（我现在不记得了）。以后能找到的话会更新的。
回答by Ben Foster
To save the contents of the editor I placed a hidden input immediately before it, and initialized the editor like so:
为了保存编辑器的内容，我在它之前放置了一个隐藏的输入，并像这样初始化编辑器：
var $editor = $('#editor');
if ($editor.length > 0) {
var editor = ace.edit('editor');
editor.session.setMode("ace/mode/css");
$editor.closest('form').submit(function() {
var code = editor.getValue();
$editor.prev('input[type=hidden]').val(code);
});
}
When my form is submitted we get the editor value and copy it to the hidden input.
当我的表单被提交时，我们获取编辑器值并将其复制到隐藏输入。
回答by Sel?ukDERE
I solve this problem with an hidden input :)
我用隐藏输入解决了这个问题:)
<input type="hidden" name="komutdosyasi" style="display: none;">
<script src="/lib/aceeditor/src-min/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
var editor = ace.edit('editor');
editor.session.setMode("ace/mode/batchfile");
editor.setTheme("ace/theme/monokai");
var input = $('input[name="komutdosyasi"]');
editor.getSession().on("change", function () {
input.val(editor.getSession().getValue());
});
</script>
回答by Sairam Venkata
Lets assume that we have have initialized ace editor on a tag in html.
EX: <div id="MyAceEditor">this the editor place holder</div>.
让我们假设我们已经在 html 中的标签上初始化了 ace 编辑器。例如：<div id="MyAceEditor">this the editor place holder</div>。
In the javascript section, after loading ace.js,
在javascript部分，加载ace.js后，
First step is to find your editor's instance as below.
第一步是找到您的编辑器实例，如下所示。
var editor = ace.edit("MyAceEditor");
To get the value from ace editor, use getValue() method as below.
要从 ace 编辑器获取值，请使用 getValue() 方法，如下所示。
var myCode = editor.getSession().getValue();
To set the value to ace editor(to push some code into the editor), use setValue()method as below.
要将值设置为 ace 编辑器（将一些代码推送到编辑器中），请使用setValue()以下方法。
editor.getSession().setValue("write your code here");
回答by Nithish
var editor = AceEditor.getCurrentFileEditor("MyEditor");
This would return the current editor object
这将返回当前的编辑器对象
var code = editor.getValue();
This would return the text within the editor.
这将返回编辑器中的文本。
回答by Sourabh Sinha
Use the following code to get the value of ace editor, html will have
使用以下代码获取ace editor的值，html会有
<div id="aceEditor" style="height: 500px; width: 70%">some text</div>
then
然后
<script >
var some = $('#aceEditor');
some.keyup(function() {
var code = editor.getSession().getValue();
$.ajax({
type: "POST",
url: "{% url 'creatd-new' %}",
data: {'code':code},
success: function (data) {
console.log("foo");
}
});
}
</script>
