javascript - CodeMirror - 在有多个编辑器时将文本插入编辑器

标签 javascript jquery codemirror

我在一个页面上有两个 codemirror 编辑器。项目和 radio 组的下拉列表,以针对正确的编辑器。

我想做的是在更改下拉列表时将项目的值插入目标编辑器(由 radio 组删除)。

我的代码如下:但是该功能不起作用。当我提醒项目值和目标时,我得到了预期的结果,但是插入文本的功能失败了:

<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

函数(即insertStringInTemplate())工作正常;但是,问题出在 editor() 函数上,您忘记返回 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 block ,如以下代码所示:

    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);
        }

关于javascript - CodeMirror - 在有多个编辑器时将文本插入编辑器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50022542/

相关文章:

jquery - 可拖动标记 gmaps.js 获取经纬度

javascript - 如何使用 Beautiful Soup 从 python 代码中获取 javascript 函数的结果?

javascript - Codemirror 中的历史大小有限制吗?

javascript - 如何更改 CodeMirror 编辑器的字体

javascript - 在javascript中找到嵌套列表标签的最大高度?

javascript - NodeJS 模块导出

javascript - 模态 CSS 高度 100% 滚动后不覆盖屏幕?

javascript - Controller 方法在 AngularJs 中使用 Karma 调用 Jasmine 单元测试套件

javascript - ajax更新后无法使用jquery选择表行id

javascript - 将文本转换为 JavaScript 并执行