ace编辑器将粘贴的json自动格式化

 html 设置一个隐藏的文本框,可以将编辑器的文本内容赋值给文本框,方便form表单提交

<div class="layui-form-item layui-form-text">
    <label class="layui-form-label">扩展数据</label>
    <div class="layui-input-block">
        <textarea style="display : none;" placeholder="请输入指定格式的JSON"  lay-verify="isJSON" class="layui-textarea"  name="extData"></textarea>
        <div id="extDataEditor" style="height:200px"></div>
    </div>
</div>

设置编辑器样式,字体等

var editor = ace.edit("extDataEditor");
editor.setTheme("ace/theme/clouds");
editor.session.setMode("ace/mode/json");
editor.setFontSize(16);
editor.setShowPrintMargin(false);

监听事件的方法执行完后,粘贴过来的原字符串没有被格式化后的JSON字符串覆盖,两个同时显示在编辑器上,所以用了一个延时执行,将格式化好的字符串赋值给编辑器,将原字符串覆盖

editor.on("paste",function (value) {

    try {
        JSON.parse(value.text);
    } catch(e) {
        layer.msg('json格式错误', {
            time: 3000
        });
    }

    var formatJson = JSON.stringify(JSON.parse(value.text),null,2);
    setTimeout(function () {
        editor.getSession().setValue(formatJson);
    },100)

});