在实际应用中可能会碰到不同的需求，比如会根据每行不同的参数或属性设置来设置同列不同的editor类型，这时原有的例子就显的有点太过简单，不能实现我们的需求，现在应用我在项目中的操作为例，显示下实现同列不同操作的情况：（在这，我把例子的情况完全整合到了js里面配置实现，如有习惯于js实现方式的也可参考）html:<table id="comTypeAndPropertyTree"></table>//个人觉得这样更显的页面清晰，所有的配置都放到js里实现js:var types = [ {typeId:0,typeName:'Normal'}, {typeId:1,typeName:'URL'}, {typeId:2,typeName:'Symbol'} ]; $(function(){ var lastIndex; $('#comTypeAndPropertyTree').treegrid({ title:'产品库配置', height:550, rownumbers: true, animate:true, url:'getComTypeAndPropertyTreeRoot.action', idField:'id',//id=productId_propId_largetypeId_midlletypeId_comtypeId; treeField:'name', frozenColumns:[[ {title:'名称',field:'name',width:300, formatter:function(value){ return '<span style="color:red">'+value+'</span>'; } } ]], columns:[[ {title:'library',field:'library',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(!row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } }}, {title:'显示名称',field:'displayName',width:100,editor:'text'}, {title:'type',field:'type',width:100, editor:{type:'combobox',options:{valueField:'typeId',textField:'typeName',data:types}}, formatter:function(value,row){ if(row.leaf){ for(var i=0; i<types.length; i++){ if (types[i].typeId == value) return types[i].typeName; } return types[0].typeName; }else{ return ''; } } }, {title:'Expose',field:'expose',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } }}, {title:'Annotate',field:'annotate',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } } }, {title:'Load',field:'load',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } } }, {title:'Name Available',field:'nameAvailable',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } } }, {title:'Value Available',field:'valueAvailable',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } } }, {title:'Export As OAT',field:'exportAsOAT',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } } }, {title:'Required',field:'required',width:100,editor:{type:'checkbox',options:{on:'1',off:'0'}}, formatter:function(value,row){ if(row.leaf){ if(value==1){ return '<img src="images/checkbox_checked.jpg"/>'; }else{ return '<img src="images/checkbox_unchecked.jpg"/>'; } }else{ return ''; } } }, {title:'Units',field:'units',width:100,editor:'text', formatter:function(value,row){ if(row.leaf){ return value; }else{ return ''; } }}, {title:'VM',field:'vm',width:100,editor:'text', formatter:function(value,row){ if(row.leaf){ return value; }else{ return ''; } }} ]] ,onClickRow:function(row){//运用单击事件实现一行的编辑结束，在该事件触发前会先执行onAfterEdit事件 var rowIndex = row.id; if (lastIndex != rowIndex){ $('#comTypeAndPropertyTree').treegrid('endEdit', lastIndex); } } ,onDblClickRow:function(row){//运用双击事件实现对一行的编辑 var rowIndex = row.id; if (lastIndex != rowIndex){ $('#comTypeAndPropertyTree').treegrid('endEdit', lastIndex); $('#comTypeAndPropertyTree').treegrid('beginEdit', rowIndex); lastIndex = rowIndex; } } ,onBeforeEdit:function(row){ beforEditRow(row);//这里是功能实现的主要步骤和代码 } ,onAfterEdit:function(row,changes){ var rowId = row.id; $.ajax({ url:"saveProductConfig.action" , data: row, success: function(text){ $.messager.alert('提示信息',text,'info'); } }); } }); }); function beforEditRow(row){//这个是核心的，很有用的，如有同样需求的话可以借鉴实现 var libraryCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','library'); var exposeCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','expose'); var annotateCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','annotate'); var loadCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','load'); var nameAvailableCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','nameAvailable'); var valueAvailableCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','valueAvailable'); var exportAsOATCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','exportAsOAT'); var requiredCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','required'); var unitsCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','units'); var vmCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','vm'); var typeCoclum = $('#comTypeAndPropertyTree').treegrid('getColumnOption','type'); var checkboxOptionsObj = new Object(); checkboxOptionsObj.on='1'; checkboxOptionsObj.off='0'; var checkboxEditorObj = new Object(); checkboxEditorObj.type='checkbox'; checkboxEditorObj.options=checkboxOptionsObj; var comboboxOptionsObj = new Object(); comboboxOptionsObj.valueField='typeId'; comboboxOptionsObj.textField='typeName'; comboboxOptionsObj.data=types; var comboboxEditorObj = new Object(); comboboxEditorObj.type='combobox'; comboboxEditorObj.options=comboboxOptionsObj; if(row.leaf){ libraryCoclum.editor=null; exposeCoclum.editor=checkboxEditorObj; annotateCoclum.editor=checkboxEditorObj; loadCoclum.editor=checkboxEditorObj; nameAvailableCoclum.editor=checkboxEditorObj; valueAvailableCoclum.editor=checkboxEditorObj; exportAsOATCoclum.editor=checkboxEditorObj; requiredCoclum.editor=checkboxEditorObj; unitsCoclum.editor='text'; vmCoclum.editor='text'; typeCoclum.editor=comboboxEditorObj; }else{ libraryCoclum.editor=checkboxEditorObj; exposeCoclum.editor=null; annotateCoclum.editor=null; loadCoclum.editor=null; nameAvailableCoclum.editor=null; valueAvailableCoclum.editor=null; exportAsOATCoclum.editor=null; requiredCoclum.editor=null; unitsCoclum.editor=null; vmCoclum.editor=null; typeCoclum.editor=null; } }实现效果图：实现流程：onDblClickRow --（ onBeforeEdit -- onAfterEdit） -- onClickRow，操作上只需要双击和单击两个事件来完成操作，而另两个事件是在中间自动实现完成。
