文本编辑 Editor

Editor 元素扩展 为页面上可显示内容的标签如SPAN、TD、DIV等提供原地或弹出框内的文本编辑功能，并在编辑完成后可以提交给后端。编辑模式根据输入类型不同有多种模式可选，如文本、数字、选择框等。

Editor 组件的历史比较久远了，前后一共经历了四个大版本。

Editor 的第一个版本诞生于 2006 年，当前记得是应用于博客的用户自定义设置，为博客用户提供前后台一致所见即所得的设置功能。还记得当时的名字叫 TextEditor。
第二个版本开发于 2010 年，当前为数据管理后台提供表格单元格的数据编辑功能，名字叫 TdEditor。
第三个版本开发于 2018 年，为了 Keeper 管理后台完全重新开发，名字改为 Editor，提供了超过 10 种编辑功能，后来这些功能慢慢移出来成为独立组件或其他组件的一部分。在retired目录可以找到旧版本。
现在这是第 4 个版本，精简代码并丰富功能，也转变开发思路，与整个框架统一。

使用

使用需要以下相关文件。

root.js 基础库
root.editor.js 编辑功能实现。
root.popup.js 在弹出框中进行编辑时使用，如果没有引用则使用浏览器默认的弹出框。
root.input.js 使用 INPUT 扩展需要的功能时使用。

属性

Editor 不是独立的组件，可以理解为是为其他标签提供的附加功能。

使用editable属性为标签提供编辑功能，可使用服务器端事件onchange+与后端交互。

上例中{value}表示编辑后的值，也可以使用{text}。#{id}是使用 Voyager 处理的地址参数，如果没有使用 Voyager，可以使用客户端地址参数&{id}。

其他可用的属性如下：

type 编辑器类型，支持 INPUT 标签的各种输入类型如text、textarea、integer、number等，原生下拉选择框select和多行输入框textarea。因为编辑器是附加到其他元素之上的，所有有可能其他元素也可能有type属性，这时可以使用属性名editor-type来避免冲突。
allow-empty或allowEmpty 是否允许空值，默认为false。
kilo 在数字编辑模式下是否使用千分符,，如1000000会显示成1,000,000。
placeholder 在空值时的显示文字，意义同 INPUT 输入框的placeholder属性。
edit-in-prompt 在弹出框中进行编辑，默认false。
prompt-text 设置了这个属性会在弹出窗口中编辑值，这是显示在输入框上面的提示文字。
prompt-title 弹出窗口的标题文字。

开始编辑

如果显示了文字右侧的编辑按钮（默认显示为一个编辑图标），则点击按钮开始编辑，另一个启用编辑的方式是单击要编辑的文字。如果想改变开始编辑的方式，可以在元素上添加edit-on属性，例如edit-on="dblclick"，这样就改成了双击开始编辑。当然也可以通过点击其他元素开始编辑，如edit-on="click: #Button1"。

事件

onedit 开始编辑时触发，支持return。
oneditcancel 取消编辑时触发，支持return。
oneditconfirm 编辑完成时确认提交前触发，支持return
ontextchange 当文本值修改时触发更新，支持return。对应的服务器端事件ontextchange+，用来向后端提交修改。

参考链接