[发明专利]模态框构建方法、装置、电子设备、计算机可读存储介质

说明书

本发明提供了一种模态框构建方法、装置、电子设备、计算机可读存储介质，该方法包括：先为界面的元素绑定JS对象，JS对象包括模态框的属性信息，属性信息包括文字内容和模态框的标签元素对应函数的函数名；然后生成指令文件，所述指令文件包括一个JS文件以及一个html文件；JS文件包括与JS对象对应的数据以及函数名与函数内容的对应关系；JS对象对应的数据包括文字内容、所述函数名与标签元素的对应关系；html文件包括模态框的、内容变量、标签元素。由于在JS对象内保存的是模态框的属性信息，所有的JS对象对应的数据都保存在一个指令文件内，对于重复使用的函数内容，只需要在指令文件中保存一次即可，减轻了代码的冗余。

技术领域

本发明涉及数据处理技术领域，具体而言，涉及一种模态框构建方法、装置、电子设备、计算机可读存储介质。

背景技术

模态框(Modal)是覆盖在父窗体上的子窗体，用于为系统和用户之间提供一个交互界面。在目前的市场需求和产品项目中，模态框的使用极为广泛，尤其是管理界面，模态框必不可少。当在前端界面进行一些操作时，如查看、删除等，需要弹出模态框对用户进行一些提示或向用户直接展示内容，增强交互体验，减少页面的跳转。

随着产品功能模块的增加，模态框的使用量也越来越大，造成大量代码冗余。

发明内容

有鉴于此，本发明实施例的目的在于提供一种模态框构建方法、装置、电子设备、计算机可读存储介质，以缓解上述问题。

第一方面，本发明实施例提供了一种模态框构建方法，所述方法包括：为界面的元素绑定JS对象，所述JS对象包括模态框的属性信息，所述属性信息包括所述模态框展示的文字内容以及模态框的标签元素对应函数的函数名；生成指令文件，所述指令文件包括一个JS文件以及一个html文件；所述JS文件包括与所述JS对象对应的数据和函数名与函数内容的对应关系；所述JS对象对应的数据包括所述文字内容、所述函数名与标签元素的对应关系；所述html文件包括所述模态框的内容变量和标签元素。

第二方面，本发明实施例提供了一种模态框构建装置，所述装置包括：绑定模块，用于为界面的元素绑定JS对象，所述JS对象包括模态框的属性信息，所述属性信息包括所述模态框展示的文字内容以及模态框的标签元素对应函数的函数名；生成模块，用于生成指令文件，所述指令文件包括一个JS文件以及一个html文件；所述JS文件包括与所述JS对象对应的数据和函数名与函数内容的对应关系；所述JS对象对应的数据包括所述文字内容、所述函数名与标签元素的对应关系；所述html文件包括所述模态框的内容变量和标签元素。

第三方面，本发明实施例提供了一种计算机可读存储介质，所述计算机可读存储介质中存储有计算机程序，当所述计算机程序在计算机上运行时，使得所述计算机执行第一方面所述的模态框构建方法。

第四方面，本发明实施例还提供了一种电子设备，包括处理器以及存储器，所述存储器内存储有计算机程序，当所述计算机程序被所述处理器执行时，使得所述电子设备执行第一方面所述的模态框构建方法。

与现有技术相比，本发明各实施例提出的模态框构建方法、装置、电子设备、计算机可读存储介质，先为界面的元素绑定JS对象，所述JS对象包括模态框的属性信息，所述属性信息包括所述模态框展示的文字内容以及模态框的标签元素对应函数的函数名；然后生成指令文件，所述指令文件包括一个JS文件以及一个html文件；所述JS文件包括与所述JS对象对应的数据以及函数名与函数内容的对应关系；所述JS对象对应的数据包括所述文字内容、所述函数名与标签元素的对应关系；所述html文件包括所述模态框的内容变量和标签元素。由于在JS对象内保存的是模态框的属性信息，所有的JS对象对应的数据都保存在一个指令文件内，函数内容也保存在指令文件内，对于重复使用的函数内容只需要在指令文件中保存一次即可，减轻了代码的冗余。

为使本发明的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。