1，效果图
2，功能说明
当我把光标放在【指标对象】的控件框的时候，双击【字段名称】，则字段数据写入指标对象控件框
当我把光标放在【指标维度】的控件框的时候，双击【字段名称】，则字段数据写入指标维度控件框
当我把光标放在【指标sql】的控件框的时候，双击【字段名称】，则字段数据写入指标sql控件框
也就是鼠标光标在哪，双击之后的数据就写入哪个控件框中
3，代码
样式代码：
<div class="flex height26" style="height: 100px;">
<div class="layui-form-item flex">
<label class="layui-form-label">指标对象</label>
<div class="layui-input-block marginleft10">
<textarea id="zbobj" type="text" name="zbobj" class="layui-textarea" onfocus="this.className='layui-textarea';this.onmousout='';getAddFocus('zbobj');"style=" width:410px;height: 84px;">${
entity.zbobj}</textarea>
</div>
</div>
</div>
<div class="flex height26" style="height: 100px;">
<div class="layui-form-item flex">
<label class="layui-form-label">指标维度</label>
<div class="layui-input-block marginleft10">
<textarea id="zbdimension" type="text" name="zbdimension" class="layui-textarea" onfocus="this.className='layui-textarea';this.onmousout='';getAddFocusdimen('zbdimension');"style=" width:410px;height: 84px;">${
entity.zbdimension}</textarea>
</div>
</div>
</div>
<div class="flex height26" style="height: 100px;">
<div class="layui-form-item flex">
<label class="layui-form-label">指标sql</label>
<div class="layui-input-block marginleft10">
<textarea id="zbsql" type="text" name="zbsql" class="layui-textarea"
style=" width:410px;height: 84px;">${
entity.zbsql}</textarea>
</div>
</div>
</div>
事件代码：
思路：
1，设置一个标签值status，监控光标在哪个选择器的控件中
2，根据status的值，对数据表格中获取的数据写入控件中
//设置默认状态
var status=1;
//设置编辑器文本框样式，想要起作用，需要引入对应的js文件
editor = CodeMirror.fromTextArea(document.getElementById("zbsql"), {
lineNumbers: true,
matchBrackets: true,
lineWrapping:true,
mode: "text/x-plsql"
});
editor.setOption("theme", "eclipse");
editor.setSize('410px','86px');
editor.setValue($("#zbsql").val());
//监控控件状态
function getAddFocus(id) {
//针对添加操作中的简介和备注，textarea获得焦点清空输入框
status=1;
}
function getAddFocusdimen(id) {
//针对添加操作中的简介和备注，textarea获得焦点清空输入框
status=2;
}
editor.on("focus",function(){
status=3;
});
//获取光标所在输入框，传值
function selectTableField(selectformCode,fieldcode,selectformName,fieldzhname){
// var relation="["+name+"."+code+"]";
if(status==1){
var str=$("#zbobj").val()+","
$("#zbobj").val(str+fieldcode)
}else if (status==2){
var str=$("#zbdimension").val()+","
$("#zbdimension").val(str+fieldcode)
}else if (status==3){
tablecode=selectformCode;
tablefield=fieldcode;
if(tablecode!=undefined){
expression+="["+tablecode+"."+tablefield+"]"
}
var relation="["+selectformName+"."+fieldzhname+"]";
var selection=editor.getSelection();
editor.replaceSelection(selection+relation);
// editor.setValue("["+selectformCode+"."+fieldcode+"]");
var content=editor.getValue();
editor.focus();
}
}
4，知识
1，原文链接：codeMirror事件的简单应用
下面是对各种事件的总结：
各种CodeMirror对象都会触发事件，客户端代码通过这些事件对各种情况作出反应。这些事件可以通过on和off来绑定和解除绑
定处理函数。如果要触发自定义的事件，使用CodeMirror.signal(target, name, args…)，
其中，target是一个非DOM节点(non-DOM-node)对象。
1：change：每次编辑器内容更改时触发
2：changes：这个事件和change事件类似，只是这个事件会批处理每个操作
3：beforeChange：事件在更改生效前触发
4：cursorActivity：当光标或选中(内容)发生变化，或者编辑器的内容发生了更改的时候触发。
5：keyHandled：快捷键映射(key map)中的快捷键被处理(handle)后触发
6：inputRead：当用户输入或粘贴时编辑器时触发
7：electrictInput：收到指定的electrict输入时触发，会影响行缩进。
8：beforeSelectionChange：此事件在选中内容变化前触发
9：viewportChange：编辑器的视口( view port )改变（滚动，编辑或其它动作）时触发。
10：swapDoc：使用swapDoc替换编辑器内的文档时触发
11：gutterClick：编辑器的gutter(行号区域)点击时触发。
12：gutterContextMenu：编辑器的gutter(行号区域)收到上下文菜单事件时触发。
13：focus：编辑器收到焦点时触发
14：blur：编辑器失去焦点时触发。
15：scroll：编辑器滚动条滚动时触发
16：scrollCursorIntoView：编辑器滚动光标到视口内时触发
17：update：当CodeMirror更新其DOM显示时触发
18：renderLine：行渲染或重新渲染时触发。
2，原文链接：textarea焦点的用法(获取焦点清空，失去焦点提示)
参考应用：
<tr>
<td align="right" valign="top">备注：</td>
<td><textarea name="" id="remark" cols="" rows="" class="textarea220" οnfοcus="this.className='textarea220L';this.οnmοuseοut='';getAddFocus('remark');" οnblur="this.className='textarea220';this.οnmοuseοut=function(){this.className='textarea220'};lostAddFocus('remark');" οnmοusemοve="this.className='textarea220Lg'" οnmοuseοut="this.className='textarea220'"></textarea></td>
</tr>
textarea焦点的用法参考：
1.文本框显示默认文字：
<textarea>白鸽男孩</textarea>
<textarea>白鸽男孩</textarea>
2.鼠标点击文本框，默认文字消失：
<textarea οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}”>白鸽男孩</textarea>
<textarea οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}”>白鸽男孩</textarea>
3.鼠标移至文本框，默认文字消失：
<textarea οnmοuseοver=”focus()” οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}”>白鸽男孩</textarea>
<textarea οnmοuseοver=”focus()” οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}”>白鸽男孩</textarea>
4.鼠标点击文本框，默认文字消失，点击文本框外任意区域，默认文字又重现：
<textarea οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}” οnblur=”if(value==’ ‘) {
value=’白鸽男孩’}”>白鸽男孩</textarea>
<textarea οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}” οnblur=”if(value==’ ‘) {
value=’白鸽男孩’}”>白鸽男孩</textarea>
5.鼠标移至文本框，默认文字消失，鼠标移出文本框，默认文字又重现：
<textarea οnmοuseοver=”focus()” οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}” οnmοuseοut=”blur()” οnblur=”if (value==’ ‘) {
value=’白鸽男孩’}”>白鸽男孩</textarea>
<textarea οnmοuseοver=”focus()” οnfοcus=”if(value==’白鸽男孩’) {
value=’ ‘}” οnmοuseοut=”blur()” οnblur=”if (value==’ ‘) {
value=’白鸽男孩’}”>白鸽男孩</textarea>
6.鼠标单击文本框，文本框内任何文字消失（包括默认文字及后来输入的文字）：
<textarea οnclick=”value=’ ‘”>白鸽男孩</textarea>
<textarea οnclick=”value=’ ‘”>白鸽男孩</textarea>
7.鼠标移至文本框，文本框内任何文字消失（包括默认文字及后来输入的文字）：
<textarea οnmοuseοver=”value=’ ‘”>白鸽男孩</textarea>
<textarea οnmοuseοver=”value=’ ‘”>白鸽男孩</textarea>
8.单击文本框后全选文本框内的文字：
<textarea οnfοcus=”select()”>白鸽男孩</textarea>
<textarea οnfοcus=”select()”>白鸽男孩</textarea>
9.鼠标移至文本框全选文本框内的文字：
<textarea οnmοuseοver=”focus()” οnfοcus=”select()”>白鸽男孩</textarea>
<textarea οnmοuseοver=”focus()” οnfοcus=”select()”>白鸽男孩</textarea>
10.回车后焦点从当前文本框转移到下一个文本框：
<textarea οnkeydοwn=”if(event.keyCode==13)event.keyCode=9″>白鸽男孩</textarea>
<textarea οnkeydοwn=”if(event.keyCode==13)event.keyCode=9″>白鸽男孩</textarea>
11.回车后焦点从当前文本框转移到指定位置：
<textarea οnkeypress=”return focusNext(this,’指定位置的id名称’,event)”>白鸽男孩</textarea>
总结：以上用法，我根据自己需求，验证了部分用法，并成功实现需求，其他未验证的部分，欢迎各位验证指正。