发明内容
本申请实施例提供了一种添加页面批注的处理方法、装置、计算机设备和计算机可读存储介质,以至少解决相关技术中添加页面批注后端需要保存整个页面的HTML文本导致请求时间长、加载速度慢的问题。
第一方面,本申请实施例提供了一种添加页面批注的处理方法,包括:
在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;
在所述页面中弹出批注提示浮层;
若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;
获取用户在所述批注内容输入框中输入的批注数据;
将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中。
在其中一些实施例中,在检测到用户在页面中选择文本时,在获取所选择的文本在所述页面中的位置信息之前,所述方法还包括;
获取所述所选择的文本以及所述所选择的文本对应的父节点;
根据所述所选择的文本对应的父节点查找是否存在具有批注容器属性的节点,其中,所述批注容器属性用于指示允许对所述所选择的文本添加批注;
若存在具有批注容器属性的节点,则执行所述获取所选择的文本在所述页面中的位置信息的步骤。
在其中一些实施例中,在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息包括;
获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;
获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;
其中,所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息包括;
获取批注容器属性值;
获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;
获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;
其中,所述批注容器属性值、所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,在将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中之后,所述方法还包括;
向所述后端服务器请求所述所选择的文本在所述页面中的位置信息,并基于所述所选择的文本在所述页面中的位置信息定位所述所选择的文本所在的节点;
为所述所选择的文本所在的节点绑定点击事件;
在检测到触发所述点击事件时,则执行所述弹出批注内容输入框的步骤。
在其中一些实施例中,在弹出批注内容输入框之后,所述方法还包括;
判断所述所选择的文本所在的节点是否有对应的批注数据;
若所述所选择的文本所在的节点有对应的批注数据,在检测到所述用户触发批注删除请求时,则删除所述所选择的文本所在的节点绑定的点击事件,并删除所述所选择的文本所在的节点对应的批注数据;在检测到所述用户触发批注保存请求时,则执行获取用户在所述批注内容输入框中输入的批注数据、将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中的步骤。
第二方面,本申请实施例提供了一种添加页面批注的处理装置,包括:
第一获取单元,用于在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;
第一弹出单元,用于在所述页面中弹出批注提示浮层;
第二弹出单元,用于若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;
第二获取单元,用于获取用户在所述批注内容输入框中输入的批注数据;
存储单元,用于将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中。
在其中一些实施例中,所述装置还包括;
第三获取单元,用于在检测到用户在页面中选择文本时,在获取所选择的文本在所述页面中的位置信息之前,获取所述所选择的文本以及所述所选择的文本对应的父节点;
查找单元,用于根据所述所选择的文本对应的父节点查找是否存在具有批注容器属性的节点,其中,所述批注容器属性用于指示允许对所述所选择的文本添加批注;
第四获取单元,用于若存在具有批注容器属性的节点,则执行所述获取所选择的文本在所述页面中的位置信息的步骤。
第三方面,本申请实施例提供了一种计算机设备,包括存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现如上述第一方面所述的添加页面批注的处理方法。
第四方面,本申请实施例提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现如上述第一方面所述的添加页面批注的处理方法。
相比于相关技术,本申请实施例提供的添加页面批注的处理方法,通过在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;在所述页面中弹出批注提示浮层;若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;获取用户在所述批注内容输入框中输入的批注数据;将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中,由于只存储所选择的文本的位置信息以及所添加的批注数据,能够解决相关技术中添加页面批注后端需要保存整个页面的HTML文本导致请求时间长、加载速度慢的问题,实现了缩短请求时间、加快加载缩短的技术效果。
本申请的一个或多个实施例的细节在以下附图和描述中提出,以使本申请的其他特征、目的和优点更加简明易懂。
具体实施方式
为了使本申请的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本申请进行描述和说明。应当理解,此处所描述的具体实施例仅仅用以解释本申请,并不用于限定本申请。基于本申请提供的实施例,本领域普通技术人员在没有作出创造性劳动的前提下所获得的所有其他实施例,都属于本申请保护的范围。
显而易见地,下面描述中的附图仅仅是本申请的一些示例或实施例,对于本领域的普通技术人员而言,在不付出创造性劳动的前提下,还可以根据这些附图将本申请应用于其他类似情景。此外,还可以理解的是,虽然这种开发过程中所作出的努力可能是复杂并且冗长的,然而对于与本申请公开的内容相关的本领域的普通技术人员而言,在本申请揭露的技术内容的基础上进行的一些设计,制造或者生产等变更只是常规的技术手段,不应当理解为本申请公开的内容不充分。
在本申请中提及“实施例”意味着,结合实施例描述的特定特征、结构或特性可以包含在本申请的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例,也不是与其它实施例互斥的独立的或备选的实施例。本领域普通技术人员显式地和隐式地理解的是,本申请所描述的实施例在不冲突的情况下,可以与其它实施例相结合。
除非另作定义,本申请所涉及的技术术语或者科学术语应当为本申请所属技术领域内具有一般技能的人士所理解的通常意义。本申请所涉及的“一”、“一个”、“一种”、“该”等类似词语并不表示数量限制,可表示单数或复数。本申请所涉及的术语“包括”、“包含”、“具有”以及它们任何变形,意图在于覆盖不排他的包含;例如包含了一系列步骤或模块(单元)的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元,而是可以还包括没有列出的步骤或单元,或可以还包括对于这些过程、方法、产品或设备固有的其它步骤或单元。本申请所涉及的“连接”、“相连”、“耦接”等类似的词语并非限定于物理的或者机械的连接,而是可以包括电气的连接,不管是直接的还是间接的。本申请所涉及的“多个”是指两个或两个以上。“和/或”描述关联对象的关联关系,表示可以存在三种关系,例如,“A和/或B”可以表示:单独存在A,同时存在A和B,单独存在B这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。本申请所涉及的术语“第一”、“第二”、“第三”等仅仅是区别类似的对象,不代表针对对象的特定排序。
本实施例提供了一种移动终端。图1是根据本申请实施例的移动终端的结构框图。如图1所示,该移动终端包括:射频(Radio Frequency,简称为RF)电路110、存储器120、输入单元130、显示单元140、传感器150、音频电路160、无线保真(wireless fidelity,简称为WiFi)模块170、处理器180、以及电源190等部件。本领域技术人员可以理解,图1中示出的移动终端结构并不构成对移动终端的限定,可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。
下面结合图1对移动终端的各个构成部件进行具体的介绍:
RF电路110可用于收发信息或通话过程中,信号的接收和发送,特别地,将基站的下行信息接收后,给处理器180处理;另外,将设计上行的数据发送给基站。通常,RF电路包括但不限于天线、至少一个放大器、收发信机、耦合器、低噪声放大器(LowNoiseAmplifier,简称为LNA)、双工器等。此外,RF电路110还可以通过无线通信与网络和其他设备通信。上述无线通信可以使用任一通信标准或协议,包括但不限于全球移动通讯系统(Global System of Mobile communication,简称为GSM)、通用分组无线服务(GeneralPacket Radio Service,简称为GPRS)、码分多址(Code Division Multiple Access,简称为CDMA)、宽带码分多址(Wideband Code Division Multiple Access,简称为WCDMA)、长期演进(Long Term Evolution,简称为LTE)、电子邮件、短消息服务(Short MessagingService,简称为SMS)等。
存储器120可用于存储软件程序以及模块,处理器180通过运行存储在存储器120的软件程序以及模块,从而执行移动终端的各种功能应用以及数据处理。存储器120可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等;存储数据区可存储根据移动终端的使用所创建的数据(比如音频数据、电话本等)等。此外,存储器120可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。
输入单元130可用于接收输入的数字或字符信息,以及产生与移动终端的用户设置以及功能控制有关的键信号输入。具体地,输入单元130可包括触控面板131以及其他输入设备132。触控面板131,也称为触摸屏,可收集用户在其上或附近的触摸操作(比如用户使用手指、触笔等任何适合的物体或附件在触控面板131上或在触控面板131附近的操作),并根据预先设定的程式驱动相应的连接装置。可选的,触控面板131可包括触摸检测装置和触摸控制器两个部分。其中,触摸检测装置检测用户的触摸方位,并检测触摸操作带来的信号,将信号传送给触摸控制器;触摸控制器从触摸检测装置上接收触摸信息,并将它转换成触点坐标,再送给处理器180,并能接收处理器180发来的命令并加以执行。此外,可以采用电阻式、电容式、红外线以及表面声波等多种类型实现触控面板131。除了触控面板131,输入单元130还可以包括其他输入设备132。具体地,其他输入设备132可以包括但不限于物理键盘、功能键(比如音量控制按键、开关按键等)、轨迹球、鼠标、操作杆等中的一种或多种。
显示单元140可用于显示由用户输入的信息或提供给用户的信息以及移动终端的各种菜单。显示单元140可包括显示面板141,可选的,可以采用液晶显示器(LiquidCrystal Display,简称为LCD)、有机发光二极管(Organic Light-Emitting Diode,简称为OLED)等形式来配置显示面板141。进一步的,触控面板131可覆盖显示面板141,当触控面板131检测到在其上或附近的触摸操作后,传送给处理器180以确定触摸事件的类型,随后处理器180根据触摸事件的类型在显示面板141上提供相应的视觉输出。虽然在图1中,触控面板131与显示面板141是作为两个独立的部件来实现移动终端的输入和输入功能,但是在某些实施例中,可以将触控面板131与显示面板141集成而实现移动终端的输入和输出功能。
移动终端还可包括至少一种传感器150,比如光传感器、运动传感器以及其他传感器。具体地,光传感器可包括环境光传感器及接近传感器,其中,环境光传感器可根据环境光线的明暗来调节显示面板141的亮度,接近传感器可在移动终端移动到耳边时,关闭显示面板141和/或背光。作为运动传感器的一种,加速计传感器可检测各个方向上(一般为三轴)加速度的大小,静止时可检测出重力的大小及方向,可用于识别移动终端姿态的应用(比如横竖屏切换、相关游戏、磁力计姿态校准)、振动识别相关功能(比如计步器、敲击)等;至于移动终端还可配置的陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器,在此不再赘述。
音频电路160中的扬声器161,传声器162可提供用户与移动终端之间的音频接口。音频电路160可将接收到的音频数据转换后的电信号,传输到扬声器161,由扬声器161转换为声音信号输出;另一方面,传声器162将收集的声音信号转换为电信号,由音频电路160接收后转换为音频数据,再将音频数据输出处理器180处理后,经RF电路110以发送给比如另一移动终端,或者将音频数据输出至存储器120以便进一步处理。
WiFi属于短距离无线传输技术,移动终端通过WiFi模块170可以帮助用户收发电子邮件、浏览网页和访问流式媒体等,它为用户提供了无线的宽带互联网访问。虽然图1示出了WiFi模块170,但是可以理解的是,其并不属于移动终端的必须构成,完全可以根据需要在不改变发明的本质的范围内而省略,或者替换为其他的短距离无线传输模块,例如Zigbee模块、或者WAPI模块等。
处理器180是移动终端的控制中心,利用各种接口和线路连接整个移动终端的各个部分,通过运行或执行存储在存储器120内的软件程序和/或模块,以及调用存储在存储器120内的数据,执行移动终端的各种功能和处理数据,从而对移动终端进行整体监控。可选的,处理器180可包括一个或多个处理单元;优选的,处理器180可集成应用处理器和调制解调处理器,其中,应用处理器主要处理操作系统、用户界面和应用程序等,调制解调处理器主要处理无线通信。可以理解的是,上述调制解调处理器也可以不集成到处理器180中。
移动终端还包括给各个部件供电的电源190(比如电池),优选的,电源可以通过电源管理系统与处理器180逻辑相连,从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。
尽管未示出,移动终端还可以包括摄像头、蓝牙模块等,在此不再赘述。
在本实施例中,处理器180被配置为:在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;在所述页面中弹出批注提示浮层;若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;获取用户在所述批注内容输入框中输入的批注数据;将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中。
在其中一些实施例中,处理器180还被配置为:在检测到用户在页面中选择文本时,在获取所选择的文本在所述页面中的位置信息之前,获取所述所选择的文本以及所述所选择的文本对应的父节点;根据所述所选择的文本对应的父节点查找是否存在具有批注容器属性的节点,其中,所述批注容器属性用于指示允许对所述所选择的文本添加批注;若存在具有批注容器属性的节点,则执行所述获取所选择的文本在所述页面中的位置信息的步骤。
在其中一些实施例中,处理器180还被配置为:获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;其中,所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,处理器180还被配置为:获取批注容器属性值;获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;其中,所述批注容器属性值、所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,处理器180还被配置为:在将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中之后,向所述后端服务器请求所述所选择的文本在所述页面中的位置信息,并基于所述所选择的文本在所述页面中的位置信息定位所述所选择的文本所在的节点;为所述所选择的文本所在的节点绑定点击事件;在检测到触发所述点击事件时,则执行所述弹出批注内容输入框的步骤。
在其中一些实施例中,处理器180还被配置为:在弹出批注内容输入框之后,判断所述所选择的文本所在的节点是否有对应的批注数据;若所述所选择的文本所在的节点有对应的批注数据,在检测到所述用户触发批注删除请求时,则删除所述所选择的文本所在的节点绑定的点击事件,并删除所述所选择的文本所在的节点对应的批注数据;在检测到所述用户触发批注保存请求时,则执行获取用户在所述批注内容输入框中输入的批注数据、将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中的步骤。
本实施例还提供了一种添加页面批注的处理方法。图2是根据本申请实施例的添加页面批注的处理方法的流程图,如图2所示,该流程包括如下步骤:
步骤S201,在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;
步骤S202,在所述页面中弹出批注提示浮层;
步骤S203,若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;
步骤S204,获取用户在所述批注内容输入框中输入的批注数据;
步骤S205,将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中。
上述步骤,通过在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;在所述页面中弹出批注提示浮层;若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;获取用户在所述批注内容输入框中输入的批注数据;将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中,由于只存储所选择的文本的位置信息以及所添加的批注数据,能够解决相关技术中添加页面批注后端需要保存整个页面的HTML文本导致请求时间长、加载速度慢的问题,实现了缩短请求时间、加快加载缩短的技术效果。
在其中一些实施例中,在检测到用户在页面中选择文本时,所述方法还包括;
获取所述所选择的文本以及所述所选择的文本对应的父节点;
根据所述所选择的文本对应的父节点查找是否存在具有批注容器属性的节点,其中,所述批注容器属性用于指示允许对所述所选择的文本添加批注;
若存在具有批注容器属性的节点,则执行所述获取所选择的文本在所述页面中的位置信息的步骤。
在其中一些实施例中,在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息包括;
获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;
获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;
其中,所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在另外一些实施例中,在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息包括;
获取批注容器属性值;
获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;
获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;
其中,所述批注容器属性值、所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,在将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中之后,所述方法还包括;
向所述后端服务器请求所述所选择的文本在所述页面中的位置信息,并基于所述所选择的文本在所述页面中的位置信息定位所述所选择的文本所在的节点;
为所述所选择的文本所在的节点绑定点击事件;
在检测到触发所述点击事件时,则执行所述弹出批注内容输入框的步骤。
在其中一些实施例中,在弹出批注内容输入框之后,所述方法还包括;
判断所述所选择的文本所在的节点是否有对应的批注数据;
若所述所选择的文本所在的节点有对应的批注数据,在检测到所述用户触发批注删除请求时,则删除所述所选择的文本所在的节点绑定的点击事件,并删除所述所选择的文本所在的节点对应的批注数据;在检测到所述用户触发批注保存请求时,则执行获取用户在所述批注内容输入框中输入的批注数据、将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中的步骤。
下面通过优选实施例对本申请实施例进行描述和说明。
图3是根据本申请优选实施例的一种添加页面批注的处理方法的流程图,如图3所示,该方法包括以下步骤:
步骤S301,为批注容器添注册mouseup鼠标事件。
步骤S302,用户选中一段文本后,触发mouseup事件,通过Selection DOM API获取选择文本内容以及对应的DOM节点,和data-annotation-key属性的父节点。需要说明的是,data-annotation-key属性即为上述实施例中的批注容器属性。
步骤S303,弹出批注提示浮层。
步骤S304,弹出批注内容输入弹框。
步骤S305,将data-annotation-key加上data-annotation-key所在Element到选中文本所在的Element的CSS选择器路径再加上批注文本在当前父Element中的位置组合成特殊key,并将批注数据传递给后端。需要说明的是,此处的Element即为节点。
步骤S306,刷新页面,请求后端数据,根据data-annotation-key与CSS路径找到对应的选择文本节点,绑定click事件,点击展开批注弹框。
图4是根据本申请优选实施例的另一种添加页面批注的处理方法的流程图,如图4所示,该方法包括以下步骤:
步骤S401,为批注容器注册一个mouseup事件,判断是否有批注数据,如果有执行步骤S407。
步骤S402,当用户选中一段文本后,会触发mouseup事件,执行绑定函数,通过调用DOM的SelectionAPI获取文本内容以及文本对应的父Element。
步骤S403,根据选择文本的父Element向上查找直到顶层容器Element,如果有找到data-annotation-key属性的Element,则进入步骤S404,否则退回处理函数,流程结束。
步骤S404,弹出批注提示浮层,用户选择添加则进入步骤S405,否则关闭浮层并退出处理函数,流程结束。
步骤S405,弹出批注内容输入弹框,判断当前节点是否有批注内容,如果有则显示批注内容,并且提供保存与删除功能。用户点击保存则进入步骤S406,点击删除则进入步骤S409,取消则关闭弹框并退出处理函数,流程结束。
步骤S406,将data-annotation-key加上data-annotation-key所在Element到选中文本所在的Element的CSS选择器路径再加上批注文本在当前父Element中的位置组合成特殊key,并将批注数据传递给后端。
步骤S407,请求后端数据,根据data-annotation-key与CSS路径找到对应的选择文本Element,绑定click事件。
步骤S408,用户点击批注文本Element,触发click事件处理函数,弹出批注内容输入弹框,进入步骤S405。
步骤S409,删除批注文本Element注册的click事件,向后端发送请求删除批注内容数据。
该优选实施例通过slot插槽的方式将批注作为一个DOM容器,并为当前DOM容器注册一个mouseup鼠标事件。当触发mouseup事件时,通过Selection的DOMAPI获取用户选中文本,计算选中文本在其父Element节点所在的位置,并计算当前父Element节点到其绑定data-annotation-key元素的所有CSS选择器路径。弹出一个浮层提示用户是否添加批注,当用户输入批注内容且保存数据时,将data-annotation-key与CSS选择器路径作为Key传递给后端。
当后端返回数据时,根据data-annotation-key与CSS选择器路径找到对应的Element节点,为其应用对应的批注样式。通过事件委托机制在批注容器上注册click事件,当用户点击Element展开对应的批注弹框显示数据。
该优选实施例将富文本的批注内容改为通用JSON数据,通过自定义的key与CSS选择器找到对应的批注文本Element,并将其与批注数据进行关联。这样就可以在其他场景使用,脱离了富文本编辑的限制了,并且做到了数据与功能隔离。
该优选实施例能够实现以下技术效果:
1.解决批注只能在富文本编辑场景下的限制。
2.数据与批注文本Element隔离,降低耦合性,移植能力强。
3.由于只存储批注内容数据,大大减小请求体积。
需要说明的是,在上述流程中或者附图的流程图中示出的步骤可以在诸如一组计算机可执行指令的计算机系统中执行,并且,虽然在流程图中示出了逻辑顺序,但是在某些情况下,可以以不同于此处的顺序执行所示出或描述的步骤。
本实施例还提供了一种添加页面批注的处理装置,该装置用于实现上述实施例及优选实施方式,已经进行过说明的不再赘述。如以下所使用的,术语“模块”、“单元”、“子单元”等可以实现预定功能的软件和/或硬件的组合。尽管以下实施例所描述的装置较佳地以软件来实现,但是硬件,或者软件和硬件的组合的实现也是可能并被构想的。
图5是根据本申请实施例的添加页面批注的处理装置的结构框图,如图5所示,该装置包括:
第一获取单元51,用于在检测到用户在页面中选择文本时,获取所选择的文本在所述页面中的位置信息;
第一弹出单元52,用于在所述页面中弹出批注提示浮层;
第二弹出单元53,用于若所述用户确认为所述所选择的文本添加批注,则弹出批注内容输入框;
第二获取单元54,用于获取用户在所述批注内容输入框中输入的批注数据;
存储单元55,用于将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中。
在其中一些实施例中,所述装置还包括;
第三获取单元,用于在检测到用户在页面中选择文本时,在获取所选择的文本在所述页面中的位置信息之前,获取所述所选择的文本以及所述所选择的文本对应的父节点;
查找单元,用于根据所述所选择的文本对应的父节点查找是否存在具有批注容器属性的节点,其中,所述批注容器属性用于指示允许对所述所选择的文本添加批注;
第四获取单元,用于若存在具有批注容器属性的节点,则执行所述获取所选择的文本在所述页面中的位置信息的步骤。
在其中一些实施例中,第一获取单元51包括;
第一获取模块,用于获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;
第二获取模块,用于获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;
其中,所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,第一获取单元51包括;
第三获取模块,用于获取批注容器属性值;
第四获取模块,用于获取所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径;
第五获取模块,用于获取所述所选择的文本在所述所选择的文本对应的父节点中的位置;
其中,所述批注容器属性值、所述具有批注容器属性的节点到所述所选择的文本所在的节点的CSS选择器的路径与所述所选择的文本在所述所选择的文本对应的父节点中的位置一起唯一指示所述所选择的文本在所述页面中的位置信息。
在其中一些实施例中,所述装置还包括;
请求单元,用于在将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中之后,向所述后端服务器请求所述所选择的文本在所述页面中的位置信息,并基于所述所选择的文本在所述页面中的位置信息定位所述所选择的文本所在的节点;
绑定单元,用于为所述所选择的文本所在的节点绑定点击事件;
执行单元,用于在检测到触发所述点击事件时,则执行所述弹出批注内容输入框的步骤。
在其中一些实施例中,所述装置还包括;
判断单元,用于在弹出批注内容输入框之后,判断所述所选择的文本所在的节点是否有对应的批注数据;
处理单元,用于若所述所选择的文本所在的节点有对应的批注数据,在检测到所述用户触发批注删除请求时,则删除所述所选择的文本所在的节点绑定的点击事件,并删除所述所选择的文本所在的节点对应的批注数据;在检测到所述用户触发批注保存请求时,则执行获取用户在所述批注内容输入框中输入的批注数据、将所述所选择的文本在所述页面中的位置信息以及所述批注数据对应存储在后端服务器中的步骤。
需要说明的是,上述各个模块可以是功能模块也可以是程序模块,既可以通过软件来实现,也可以通过硬件来实现。对于通过硬件来实现的模块而言,上述各个模块可以位于同一处理器中;或者上述各个模块还可以按照任意组合的形式分别位于不同的处理器中。
本申请实施例还提供了一种计算机设备,结合本申请实施例添加页面批注的处理方法可以由计算机设备来实现。图6为根据本申请实施例的计算机设备的硬件结构示意图。
计算机设备可以包括处理器61以及存储有计算机程序指令的存储器62。
具体地,上述处理器61可以包括中央处理器(CPU),或者特定集成电路(Application Specific Integrated Circuit,简称为ASIC),或者可以被配置成实施本申请实施例的一个或多个集成电路。
其中,存储器62可以包括用于数据或指令的大容量存储器。举例来说而非限制,存储器62可包括硬盘驱动器(Hard Disk Drive,简称为HDD)、软盘驱动器、固态驱动器(SolidState Drive,简称为SSD)、闪存、光盘、磁光盘、磁带或通用串行总线(Universal SerialBus,简称为USB)驱动器或者两个或更多个以上这些的组合。在合适的情况下,存储器62可包括可移除或不可移除(或固定)的介质。在合适的情况下,存储器62可在数据处理装置的内部或外部。在特定实施例中,存储器62是非易失性(Non-Volatile)存储器。在特定实施例中,存储器62包括只读存储器(Read-Only Memory,简称为ROM)和随机存取存储器(RandomAccess Memory,简称为RAM)。在合适的情况下,该ROM可以是掩模编程的ROM、可编程ROM(Programmable Read-Only Memory,简称为PROM)、可擦除PROM(Erasable ProgrammableRead-Only Memory,简称为EPROM)、电可擦除PROM(Electrically Erasable ProgrammableRead-Only Memory,简称为EEPROM)、电可改写ROM(Electrically Alterable Read-OnlyMemory,简称为EAROM)或闪存(FLASH)或者两个或更多个以上这些的组合。在合适的情况下,该RAM可以是静态随机存取存储器(Static Random-Access Memory,简称为SRAM)或动态随机存取存储器(Dynamic Random Access Memory,简称为DRAM),其中,DRAM可以是快速页模式动态随机存取存储器(Fast Page Mode Dynamic Random Access Memory,简称为FPMDRAM)、扩展数据输出动态随机存取存储器(Extended Date Out Dynamic RandomAccess Memory,简称为EDODRAM)、同步动态随机存取内存(Synchronous Dynamic Random-Access Memory,简称SDRAM)等。
存储器62可以用来存储或者缓存需要处理和/或通信使用的各种数据文件,以及处理器61所执行的可能的计算机程序指令。
处理器61通过读取并执行存储器62中存储的计算机程序指令,以实现上述实施例中的任意一种添加页面批注的处理方法。
在其中一些实施例中,计算机设备还可包括通信接口63和总线60。其中,如图6所示,处理器61、存储器62、通信接口63通过总线60连接并完成相互间的通信。
通信接口63用于实现本申请实施例中各模块、装置、单元和/或设备之间的通信。通信接口63还可以实现与其他部件例如:外接设备、图像/数据采集设备、数据库、外部存储以及图像/数据处理工作站等之间进行数据通信。
总线60包括硬件、软件或两者,将计算机设备的部件彼此耦接在一起。总线60包括但不限于以下至少之一:数据总线(Data Bus)、地址总线(Address Bus)、控制总线(Control Bus)、扩展总线(Expansion Bus)、局部总线(Local Bus)。举例来说而非限制,总线60可包括图形加速接口(Accelerated Graphics Port,简称为AGP)或其他图形总线、增强工业标准架构(Extended Industry Standard Architecture,简称为EISA)总线、前端总线(Front Side Bus,简称为FSB)、超传输(Hyper Transport,简称为HT)互连、工业标准架构(Industry Standard Architecture,简称为ISA)总线、无线带宽(InfiniBand)互连、低引脚数(Low Pin Count,简称为LPC)总线、存储器总线、微信道架构(Micro ChannelArchitecture,简称为MCA)总线、外围组件互连(Peripheral Component Interconnect,简称为PCI)总线、PCI-Express(PCI-X)总线、串行高级技术附件(Serial AdvancedTechnology Attachment,简称为SATA)总线、视频电子标准协会局部(Video ElectronicsStandards Association Local Bus,简称为VLB)总线或其他合适的总线或者两个或更多个以上这些的组合。在合适的情况下,总线60可包括一个或多个总线。尽管本申请实施例描述和示出了特定的总线,但本申请考虑任何合适的总线或互连。
另外,结合上述实施例中的添加页面批注的处理方法,本申请实施例可提供一种计算机可读存储介质来实现。该计算机可读存储介质上存储有计算机程序指令;该计算机程序指令被处理器执行时实现上述实施例中的任意一种添加页面批注的处理方法。
以上所述实施例的各技术特征可以进行任意的组合,为使描述简洁,未对上述实施例中的各个技术特征所有可能的组合都进行描述,然而,只要这些技术特征的组合不存在矛盾,都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本申请的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对发明专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本申请构思的前提下,还可以做出若干变形和改进,这些都属于本申请的保护范围。因此,本申请专利的保护范围应以所附权利要求为准。