关于codeMirror插件使用的一个坑
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插件使用的一个坑的更多相关文章
- 在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示
在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示) 1.使用npm安装依赖 npm install --save codemirror; 2.在页面中放入如下代码 ...
- inno setup读取注册表遇到的一个坑
一.背景 目前,公司针对PR开发的一个插件需要发布到64位系统上.该插件包括一个prm格式的文件和若干个DLL文件.其中,prm文件需要复制到PR公共插件目录下,DLL需要复制到Windows系统目录 ...
- 360插件化Replugin爬坑之路
前言 继上次爬完了热修复的坑位,中途爬了各种各样的坑.今天我们来说说插件化Replugin的坑位.Replugin刚出的时候我就看过了.第一次看的时候可能心态不好.没看懂= =第二次重头在看,发现蛮简 ...
- Composer安装php插件包中有哪些坑
Composer安装php插件包中有哪些坑 一.总结 一句话总结:不要盲从扩展官方的composer安装命令,有时候也会出错 我们经常要往现有的项目中添加扩展包,有时候因为文档的错误引导,如下图来自 ...
- 8.maven上传jar包以及SNAPSHOT的一个坑
1,手动上传包 如何将一些新的外部包上传到私服当中呢? 首先是要登录上去,然后点击 Upload,找到 maven-local将jar包找到选中,然后填写对应的三个定位信息即可上传. 在引用的时候,道 ...
- 用html5的视频元素所遇到的第一个坑
html5 有一个video标签,这个是被大家所熟知的事情.按照w3c的规范,我认真的写出如下代码: <video preload="auto" controls=" ...
- 监控jvm的一个坑
监控jvm的一个坑 1,遇到的问题 我按照以往文档,在catalina.sh里追加jvm的监控api,如下 紧接着我启动 tomcat. 未报任何错误. 发现 lsof –i:12000, 12000 ...
- codeMirror插件使用讲解
codeMirror是一款十分强大的代码编辑插件,提供了十分丰富的API,最近在项目中用到了这款插件,于是在这里给大家分享下使用方法和心得: codeMirror调用非常方便 首先在页面中载入插件CS ...
- JavaScript中sort方法的一个坑(leetcode 179. Largest Number)
在做 Largest Number 这道题之前,我对 sort 方法的用法是非常自信的.我很清楚不传比较因子的排序会根据元素字典序(字符串的UNICODE码位点)来排,如果要根据大小排序,需要传入一个 ...
随机推荐
- 在android用Get方式发送http请求
烦人的日子终于过去啦,终于又可以写博客啦,对自己的android学习做个总结,方便以后查看...... 一.在android用Get方式发送http请求,使用的是java标准类,也比较简单. 主要分以 ...
- 利用Dreamweaver配置PHP服务器的站点
配置的步骤: 1.打开Dreamweaver的站点------->新建站点-------->点击保存 2.点击服务器------>保存 3.配置完成之后就可以看到在Dreamweav ...
- AVAudioPlayer播放并实现了后台播放和远程控制
// ViewController.h #import <UIKit/UIKit.h> #import <AVFoundation/AVFoundation.h> @class ...
- tomcat <context path>的意义及作用
context path 是在tomcat 要支持多个应用时对每个应用的docBase做区别时的区分符. 打个比方假如你有两个请求:一个为 http:localhost:8080/test1/hell ...
- Android Activity生命周期详讲
管理 Activity 生命周期 通过实现回调方法管理 Activity 的生命周期对开发强大而又灵活的应用至关重要. Activity 的生命周期会直接受到 Activity 与其他 Activit ...
- 深入.net(.net平台)
S2A技能点: 1.学会“自己”进行大量复杂数据的管理(数据类型.集合.xml.文件) 2.学会“优化”代码编写--- 复用.可扩展.可替换(封装.继承.多态) 什么是“跨平台”---- 您的应用程序 ...
- mac系统如何显示和隐藏文件
显示Mac隐藏文件的命令:defaults write com.apple.finder AppleShowAllFiles YES隐藏Mac隐藏文件的命令:defaults write com.ap ...
- 【代码笔记】iOS-平面化的饼图
一,效果图. 二,工程图. 三,代码. RootViewController.m - (void)viewDidLoad { [super viewDidLoad]; // Do any additi ...
- 【代码笔记】iOS-仿安卓,本页出现多个选择项
一,效果图. 二,代码. //点击任何处,弹出提示选项 -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{ UIAlert ...
- 【代码笔记】iOS-侧滑效果
一,效果图. 二,工程图. 三,代码. AppDelegate.h #import <UIKit/UIKit.h> //加入头文件 #import "PPRevealSideVi ...