JS实现单击控件可直接编辑
1. 描述
场景描述：在填报应用中，可以直接设置显示控件，但是在模板中如果控件较多的情况下，会导致页面加载速度非常慢，有时内容多时显示控件也会导致页面不美观，不得已需要放弃直接显示控件。这样默认的情况下需要双击单元格才能进入控件进行编辑，显得比较繁琐，而且如果只是单击或使用Tab键选择单元格时，直接编辑输入汉字时第一个拼音字母会被单元格吃掉，导致输入出错出错，如下图：
那么如何实现选择一次单元格后自动进入编辑状态呢，如下图
2. 实现思路利用contentPane.on事件来监测单元格选择事件，在选择单元格事件中对选择的单元格设置编辑事件。
利用contentPane提供的setEditOnClick()与setEditOnMove()来设置点击或键盘按下tab键来移动光标选择单元格时是否直接编辑。
3. 操作步骤
为模板添加加载结束事件，如下图：
代码如下：
注：此方法适用于直接鼠标选择或Tab键来选择单元格后直接显示并编辑控件
为模板添加加载结束事件，如下图：
代码如下：
3.3 总结
以上两种方法均可以实现选择单元格后直接显示控件并编辑，提高我们报表的易用性和更好的交互体验。
方法一可以结合其他代码一起使用，比如自定义添加删除行按钮或JS去除填报左上角红色三角等效果都会用到此方法。
方法二更简单直观，但是使用时必须把两行代码全加上，一个是控制鼠标选择单元格，一个是控制Tab键来选择单元格。
4. 预览效果
保存模板，选择填报预览，实现效果如上图。
注：经过测试，手机端和h5不支持该效果。
5. 已完成模板
1）方法一
附件列表
文档内容仅供参考，如果你需要获取更多帮助，付费/准付费客户请咨询帆软技术支持
关于技术问题，您还可以前往帆软社区，点击顶部搜索框旁边的提问按钮
若您还有其他非技术类问题，可以联系帆软传说哥（qq：1745114201）