CodeMirror - 在有多个编辑器时将文本插入编辑器
CodeMirror - insert text into editor when there are multiple editors
我在一个页面上有两个codemirror 编辑器。项目和单选组的下拉列表以针对正确的编辑器。
我想做的是在更改下拉列表时将项目的值插入目标编辑器(由无线电组删除)。
我的代码如下:但是该功能不起作用。当我提醒项目值和目标时,我得到了预期的结果,但是插入文本的功能失败了:
<script type="text/javascript">
function editor(id) {
var editor = CodeMirror.fromTextArea(id, {
continuousScanning: 500,
lineNumbers: true
});
editor.setSize(null, 550);
}
var config_id = document.getElementById('id_config')
var config = editor(config_id);
var remote_config_id = document.getElementById('id_remote_config')
var remote_config = editor(remote_config_id);
function insertStringInTemplate(str, target) {
if (target== "id_config") {
var doc = config
} else {
var doc = remote_config
}
var cursor = doc.getCursor();
var pos = {
line: cursor.line,
ch: cursor.ch
}
doc.replaceRange(str, pos);
}
$(function(){
// bind change event to select
$('#template_vars').on('change', function () {
var var_data = $(this).val(); // get selected value
var var_target = $('input[name=target]:checked').val();
insertStringInTemplate(var_data, var_target)
return false;
});
});
$("#template_vars").chosen({no_results_text: "Oops, nothing found!"});
</script>
however the function to insert the text is failing
function
(即insertStringInTemplate()
)正在工作good/properly;但是,问题出在 editor()
函数上,您忘记了 return editor
(即 CodeMirror 实例)。
所以一个简单的修复是:
function editor(id) {
var editor = CodeMirror.fromTextArea(id, {
continuousScanning: 500,
lineNumbers: true
});
editor.setSize(null, 550);
return editor; // <- here's the fix
}
演示 CodePen。
但是在该演示中,我向insertStringInTemplate()
函数添加了一个if
块,如下代码所示:
function insertStringInTemplate(str, target) {
if (target== "id_config") {
var doc = config
} else {
var doc = remote_config
}
// If there's a selection, replace the selection.
if ( doc.somethingSelected() ) {
doc.replaceSelection( str );
return;
}
// Otherwise, we insert at the cursor position.
var cursor = doc.getCursor();
var pos = {
line: cursor.line,
ch: cursor.ch
}
doc.replaceRange(str, pos);
}
我在一个页面上有两个codemirror 编辑器。项目和单选组的下拉列表以针对正确的编辑器。
我想做的是在更改下拉列表时将项目的值插入目标编辑器(由无线电组删除)。
我的代码如下:但是该功能不起作用。当我提醒项目值和目标时,我得到了预期的结果,但是插入文本的功能失败了:
<script type="text/javascript">
function editor(id) {
var editor = CodeMirror.fromTextArea(id, {
continuousScanning: 500,
lineNumbers: true
});
editor.setSize(null, 550);
}
var config_id = document.getElementById('id_config')
var config = editor(config_id);
var remote_config_id = document.getElementById('id_remote_config')
var remote_config = editor(remote_config_id);
function insertStringInTemplate(str, target) {
if (target== "id_config") {
var doc = config
} else {
var doc = remote_config
}
var cursor = doc.getCursor();
var pos = {
line: cursor.line,
ch: cursor.ch
}
doc.replaceRange(str, pos);
}
$(function(){
// bind change event to select
$('#template_vars').on('change', function () {
var var_data = $(this).val(); // get selected value
var var_target = $('input[name=target]:checked').val();
insertStringInTemplate(var_data, var_target)
return false;
});
});
$("#template_vars").chosen({no_results_text: "Oops, nothing found!"});
</script>
however the function to insert the text is failing
function
(即insertStringInTemplate()
)正在工作good/properly;但是,问题出在 editor()
函数上,您忘记了 return editor
(即 CodeMirror 实例)。
所以一个简单的修复是:
function editor(id) {
var editor = CodeMirror.fromTextArea(id, {
continuousScanning: 500,
lineNumbers: true
});
editor.setSize(null, 550);
return editor; // <- here's the fix
}
演示 CodePen。
但是在该演示中,我向insertStringInTemplate()
函数添加了一个if
块,如下代码所示:
function insertStringInTemplate(str, target) {
if (target== "id_config") {
var doc = config
} else {
var doc = remote_config
}
// If there's a selection, replace the selection.
if ( doc.somethingSelected() ) {
doc.replaceSelection( str );
return;
}
// Otherwise, we insert at the cursor position.
var cursor = doc.getCursor();
var pos = {
line: cursor.line,
ch: cursor.ch
}
doc.replaceRange(str, pos);
}