codeMirror插件可以做语法高亮渲染,但它操作过程是这样的:先从 textarea中读取值放到codemirror动态生成的div中,根据textarea中的换行个数确定行数,根据正则表达来高亮语法。这就有个问 题,当你在页面上对语法做出修改提交表单时,其实只是在codemirror上的动态div上做出修改,当form表单提交时,原来textarea值并 没有变化。

所以,解决办法如下

1.需要在表单提交之前将textarea渲染的editor对象的值给读取出来,反写到textarea上去。

2.使用一个onchange事件,在渲染的div值出现变化时,反写到textarea上去。

(1) ids为textarea的id,jeditor_obj 为针对textarea渲染的对象

    var ids = ['globalValueId','readyFlowId','mainFlowId','clearFlowId','exceptionFlowId'];    

    var globalValueId_Editor = new Object();

    var readyFlowId_Editor = new Object();

    var mainFlowId_Editor = new Object();

    var clearFlowId_Editor = new Object();

    var exceptionFlowId_Editor = new Object();

    var jeditor_obj = [globalValueId_Editor,readyFlowId_Editor,mainFlowId_Editor,clearFlowId_Editor,exceptionFlowId_Editor];   

(2) 各个语法高亮的editor对象

    /* 语法高亮 */

    for(var i=0;i<ids.length;i++){

         jeditor_obj[i] = CodeMirror.fromTextArea(document.getElementById(ids[i]),

            {

                lineNumbers : true,

                matchBrackets : true,

                mode : "text/x-java",

            });

    }

(3) 红色部分为提交前将值反写回textarea的操作

            submitHandler : function(form) {

                  for(var i=0;i<ids.length;i++){

                    $("#"+ids[i]).val(jeditor_obj[i].getValue());

                }

                getPost("business/mergeFlowAction");

            }

关于codeMirror插件使用的一个坑的更多相关文章

  1. 在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示

    在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示) 1.使用npm安装依赖 npm install --save codemirror; 2.在页面中放入如下代码 ...

  2. inno setup读取注册表遇到的一个坑

    一.背景 目前,公司针对PR开发的一个插件需要发布到64位系统上.该插件包括一个prm格式的文件和若干个DLL文件.其中,prm文件需要复制到PR公共插件目录下,DLL需要复制到Windows系统目录 ...

  3. 360插件化Replugin爬坑之路

    前言 继上次爬完了热修复的坑位,中途爬了各种各样的坑.今天我们来说说插件化Replugin的坑位.Replugin刚出的时候我就看过了.第一次看的时候可能心态不好.没看懂= =第二次重头在看,发现蛮简 ...

  4. Composer安装php插件包中有哪些坑

    Composer安装php插件包中有哪些坑 一.总结 一句话总结:不要盲从扩展官方的composer安装命令,有时候也会出错 我们经常要往现有的项目中添加扩展包,有时候因为文档的错误引导,如下图来自 ...

  5. 8.maven上传jar包以及SNAPSHOT的一个坑

    1,手动上传包 如何将一些新的外部包上传到私服当中呢? 首先是要登录上去,然后点击 Upload,找到 maven-local将jar包找到选中,然后填写对应的三个定位信息即可上传. 在引用的时候,道 ...

  6. 用html5的视频元素所遇到的第一个坑

    html5 有一个video标签,这个是被大家所熟知的事情.按照w3c的规范,我认真的写出如下代码: <video preload="auto" controls=" ...

  7. 监控jvm的一个坑

    监控jvm的一个坑 1,遇到的问题 我按照以往文档,在catalina.sh里追加jvm的监控api,如下 紧接着我启动 tomcat. 未报任何错误. 发现 lsof –i:12000, 12000 ...

  8. codeMirror插件使用讲解

    codeMirror是一款十分强大的代码编辑插件,提供了十分丰富的API,最近在项目中用到了这款插件,于是在这里给大家分享下使用方法和心得: codeMirror调用非常方便 首先在页面中载入插件CS ...

  9. JavaScript中sort方法的一个坑(leetcode 179. Largest Number)

    在做 Largest Number 这道题之前,我对 sort 方法的用法是非常自信的.我很清楚不传比较因子的排序会根据元素字典序(字符串的UNICODE码位点)来排,如果要根据大小排序,需要传入一个 ...

随机推荐

  1. 腾讯bugly 的crash 上报和umeng的比较

    说到crash上传工具,大家肯定会第一时间想到umeng,不错,umeng 是最早推出 crash 上报的工具之一,在刚推出来的时候,特别受到ios开发人员的喜爱. 因为个时候,内存是手动管理的,很容 ...

  2. PULL解析XML的运行机制详解

    PULL解析简单易上手,基本上看一遍,基本上就会解析啦,但总是感觉对PULL解析的运行机制不是很了解,就总结了以下事件驱动到底是怎么执行的.. PULL: Android内置了PULL解析器.PULL ...

  3. MTK 常见的编译命令

    1: ./mk n(r) kernel; ./mk bootimage;当修改build-in 到kernel相关代码时,要使用此命令,具体文件参考如下: alps/kernel/ alps/medi ...

  4. 防止IOS6与IOS7图标不一致

    点击AppIcon在属性栏内找到iOS icon is pre-rendered打上勾. 如果之前已经安装过,需要先把APP卸载掉再安装.(因为模拟器有缓存) xcode4版本的话需要在INFO内增加 ...

  5. linux 系统权限 数字含义

    摘抄: sudo chmod XXX dir_name XXX是你要设置的权限代号,第一位代表Owner,第二位代表Group,第三位代表Others XXX中0代表什么都不可以,1代表可执行,2代表 ...

  6. 荷兰国旗 Flag of the Kingdom of the Netherlands

    问题描述:现有n个红白蓝三种不同颜色的小球,乱序排列在一起,请通过两两交换任意两个球,使得从左至右的球依次为红球.白球.蓝球.这个问题之所以叫做荷兰国旗,是因为将红白蓝三色的小球弄成条状物,并有序排列 ...

  7. (视频) 《快速创建网站》 3.1 WordPress 数据导入

    本文是<快速创建网站>系列的第5篇,如果你还没有看过之前的内容,建议你点击以下目录中的章节先阅读其他内容再回到本文. 访问本系列目录,请点击:http://devopshub.cn/tag ...

  8. js中Prototype属性解释及常用方法

    1.prototype的定义 javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解释是:返回对象类型原型的引用. 每一个构造函数都有一个属 ...

  9. python urllib2 发起http请求post

    使用urllib2发起post请求 def GetCsspToken(): data = json.dumps({"userName":"wenbin", &q ...

  10. 旧项目如何切换到Entity Framework Code First

    Entity Framework Code First固然是好东西,然而如果是已经存在的旧有项目,如何简单方便的使用切换呢? 这里介绍一个VS的插件Entity Framework Power Too ...