基于指定Dom元素创建光标的方法、系统、装置和存储介质制造方法及图纸

本申请涉及一种基于指定Dom元素创建光标的方法、系统、装置和存储介质，其中，该方法包括：触发生成光标，获取当前指定的Dom元素；获取光标实例，并扩展当前指定Dom元素的自定义事件，将光标挂载到当前指定Dom元素上；在当前指定Dom元素上插入节点的情况下，判断当前是否存在预留位置，如果不存在预留位置，则创建新的预留位置，在新的预留位置生成新的光标，并将当前Dom元素的scrollTop值重置为新的光标的offsetTop值，反之，如果存在预留位置，则直接在预留位置生成新的光标，并将当前Dom元素scrollTop值重置为新的光标的offsetTop值。解决了在创建光标时，存在的实现过程复杂、挂载准确率低等问题，提高了挂载准确率。且在点击对象切换时，不需要缓存之前的range对象，节约资源。约资源。约资源。

【技术实现步骤摘要】
基于指定Dom元素创建光标的方法、系统、装置和存储介质


[0001]本申请涉及计算机
，特别是涉及基于指定Dom元素创建光标的方法、系统、装置和存储介质。

技术介绍

[0002]现如今，随着前端技术的快速成长，出现了许多基于浏览器进行在线协同办公、在线文档攥写、在线聊天沟通等场景。而为了实现这些场景中的消息回复或文字输入等功能，就需要对range光标进行定位处理。
[0003]在相关技术中，光标range的创建只能基于window与document，无法通过当前挂载的元素去获取。而且，对于不可编辑元素，如图片等，在创建光标时，需要在元素的两侧都创建占位符，比较复杂。此外，相关技术中无法准确的确定当前光标range的创建对象，可能会出现光标range挂载到别的节点的情况，影响光标挂载的准确性。
[0004]目前针对相关技术中，在创建光标时，存在的实现过程复杂、挂载准确率低等问题，尚未提出有效的解决方案。

技术实现思路

[0005]本申请实施例提供了一种基于指定Dom元素创建光标的方法、系统、装置和存储介质，以至少解决相关技术中在创建光标时，存在的实现过程复杂、挂载准确率低等问题。
[0006]第一方面，本申请实施例提供了一种基于指定Dom元素创建光标的方法，所述方法包括：
[0007]触发生成光标，获取当前指定的Dom元素；
[0008]获取光标实例，并扩展当前指定Dom元素的自定义事件，将光标挂载到所述当前指定Dom元素上；
[0009]在所述当前指定Dom元素上插入节点的情况下，判断当前是否存在预留位置，如果不存在预留位置，则创建新的预留位置，在所述新的预留位置生成新的光标，并将当前Dom元素的scrollTop值重置为新的光标的offsetTop值，反之，如果存在预留位置，则直接在预留位置生成新的光标，并将当前Dom元素scrollTop值重置为新的光标的offsetTop值。
[0010]在其中一些实施例中，所述插入节点包括：
[0011]通过调用window下继承的方法，在预留位置处插入节点内容。
[0012]在其中一些实施例中，将光标挂载到所述当前指定Dom元素上包括：
[0013]判断所述光标是否成功挂载到所述当前指定Dom元素上，若挂载失败，则出现失败提示，反之则结束。
[0014]在其中一些实施例中，在Dom元素的scrollTop值设置完成之后，所述方法还包括：
[0015]获取整个Dom元素，直接调用自定义或软件内部自带的编辑方法在所述Dom元素中编辑内容。
[0016]第二方面，本申请实施例提供了一种基于指定Dom元素创建光标的系统，所述系统
包括：
[0017]获取模块，用于触发生成光标，获取当前指定的Dom元素；
[0018]挂载模块，用于获取光标实例，并扩展当前指定Dom元素的自定义事件，将光标挂载到所述当前指定Dom元素上；
[0019]设置模块，用于在所述当前指定Dom元素上插入节点的情况下，判断当前是否存在预留位置，如果不存在预留位置，则创建新的预留位置，在所述新的预留位置生成新的光标，并将当前Dom元素的scrollTop值重置为新的光标的offsetTop值，反之，如果存在预留位置，则直接在预留位置生成新的光标，并将当前Dom元素scrollTop值重置为新的光标的offsetTop值。
[0020]在其中一些实施例中，所述设置模块，还用于通过调用window下继承的方法，在预留位置处插入节点内容。
[0021]在其中一些实施例中，所述挂载模块，还用于判断所述光标是否成功挂载到所述当前指定Dom元素上，若挂载失败，则出现失败提示，反之则结束。
[0022]在其中一些实施例中，所述系统还包括编辑模块，在Dom元素的scrollTop值设置完成之后，
[0023]所述编辑模块，用于获取整个Dom元素，直接调用自定义或软件内部自带的编辑方法在所述Dom元素中编辑内容。
[0024]第三方面，本申请实施例提供了一种电子装置，包括存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现如上述第一方面所述的基于指定Dom元素创建光标的方法。
[0025]第四方面，本申请实施例提供了一种存储介质，其上存储有计算机程序，该程序被处理器执行时实现如上述第一方面所述的基于指定Dom元素创建光标的方法。
[0026]相比于相关技术，本申请实施例提供的基于指定Dom元素创建光标的方法，触发生成光标，获取当前指定的Dom元素；获取光标实例，并扩展当前指定Dom元素的自定义事件，将光标挂载到当前指定Dom元素上；在当前指定Dom元素上插入节点的情况下，判断当前是否存在预留位置，如果不存在预留位置，则创建新的预留位置，在新的预留位置生成新的光标，并将当前Dom元素的scrollTop值重置为新的光标的offsetTop值，反之，如果存在预留位置，则直接在预留位置生成新的光标，并将当前Dom元素scrollTop值重置为新的光标的offsetTop值。
[0027]通过本申请能实现更便捷、更轻量的在线聊天输入框中光标的定位，解决了在创建光标时，存在的实现过程复杂、挂载准确率低等问题，提高了挂载准确率。且在点击对象切换时，不需要缓存之前的range对象，节约资源。
附图说明
[0028]此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：
[0029]图1是根据本申请实施例的基于指定Dom元素创建光标的方法的应用环境示意图；
[0030]图2是根据本申请实施例的基于指定Dom元素创建光标的方法的流程图；
[0031]图3是根据本申请实施例的节点插入设置的流程示意图；
[0032]图4是根据本申请实施例的基于指定Dom元素创建光标的系统的结构框图；
[0033]图5是根据本申请实施例的另一种基于指定Dom元素创建光标的系统的结构框图；
[0034]图6是根据本申请实施例的电子设备的内部结构示意图。
具体实施方式
[0035]为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行描述和说明。应当理解，此处所描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。基于本申请提供的实施例，本领域普通技术人员在没有作出创造性劳动的前提下所获得的所有其他实施例，都属于本申请保护的范围。此外，还可以理解的是，虽然这种开发过程中所作出的努力可能是复杂并且冗长的，然而对于与本申请公开的内容相关的本领域的普通技术人员而言，在本申请揭露的
技术实现思路
的基础上进行的一些设计，制造或者生产等变更只是常规的技术手段，不应当理解为本申请公开的内容不充分。
[0036]在本申请中提及“实施例”意味着，结合本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于指定Dom元素创建光标的方法，其特征在于，所述方法包括：触发生成光标，获取当前指定的Dom元素；获取光标实例，并扩展当前指定Dom元素的自定义事件，将光标挂载到所述当前指定Dom元素上；在所述当前指定Dom元素上插入节点的情况下，判断当前是否存在预留位置，如果不存在预留位置，则创建新的预留位置，在所述新的预留位置生成新的光标，并将当前Dom元素的scrollTop值重置为新的光标的offsetTop值，反之，如果存在预留位置，则直接在预留位置生成新的光标，并将当前Dom元素scrollTop值重置为新的光标的offsetTop值。2.根据权利要求1所述的方法，其特征在于，所述插入节点包括：通过调用window下继承的方法，在预留位置处插入节点内容。3.根据权利要求1所述的方法，其特征在于，将光标挂载到所述当前指定Dom元素上包括：判断所述光标是否成功挂载到所述当前指定Dom元素上，若挂载失败，则出现失败提示，反之则结束。4.根据权利要求1所述的方法，其特征在于，在Dom元素的scrollTop值设置完成之后，所述方法还包括：获取整个Dom元素，直接调用自定义或软件内部自带的编辑方法在所述Dom元素中编辑内容。5.一种基于指定Dom元素创建光标的系统，其特征在于，所述系统包括：获取模块，用于触发生成光标，获取当前指定的Dom元素；挂载模块，用于获取光标实例，并扩展当前指定Dom元素的自定义事件，将光标挂载到所述当前指定...

【专利技术属性】
技术研发人员：潘忠王，
申请(专利权)人：浙江百应科技有限公司，
类型：发明
国别省市：