CN112099891A - 弹窗展示方法、装置、电子设备及计算机可读存储介质 - Google Patents

弹窗展示方法、装置、电子设备及计算机可读存储介质 Download PDF

Info

Publication number
CN112099891A
CN112099891A CN202010949426.7A CN202010949426A CN112099891A CN 112099891 A CN112099891 A CN 112099891A CN 202010949426 A CN202010949426 A CN 202010949426A CN 112099891 A CN112099891 A CN 112099891A
Authority
CN
China
Prior art keywords
pop
window
target
popup
level
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN202010949426.7A
Other languages
English (en)
Other versions
CN112099891B (zh
Inventor
贺成璋
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Asiainfo Technology Nanjing Co ltd
Original Assignee
Asiainfo Technology Nanjing Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Asiainfo Technology Nanjing Co ltd filed Critical Asiainfo Technology Nanjing Co ltd
Priority to CN202010949426.7A priority Critical patent/CN112099891B/zh
Publication of CN112099891A publication Critical patent/CN112099891A/zh
Application granted granted Critical
Publication of CN112099891B publication Critical patent/CN112099891B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请提供了一种弹窗展示方法、装置、电子设备及计算机可读存储介质,涉及计算机领域。该方法包括:若接收到针对目标弹窗的展示指令,确定展示指令中目标弹窗的标识;查询标识的上一级标识;若查询到上一级标识,则确认当前展示页面的遮罩层中已展示有与上一级标识对应的弹窗;在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗。本申请可以实现对弹窗展示的页面大小无限制。

Description

弹窗展示方法、装置、电子设备及计算机可读存储介质
技术领域
本申请涉及计算机技术领域,具体而言,本申请涉及一种弹窗展示方法、装置、电子设备及计算机可读存储介质。
背景技术
在web前端交互页面中,常常需要借助弹窗进行内容展示,随着应用需求的逐渐加深,多层弹窗的应用也越大越广泛,多层弹窗在页面上如何合理的展示一直是人们关心的问题。
目前,现有的多层弹窗展示方式一般是:各层弹窗使用不同的遮罩层,采用遮罩层叠加的方式将下一级弹窗覆盖在上级弹窗之上,使下一级弹窗的遮罩层区域位于上一级弹窗的遮罩层区域中,可见,这种方式要求下级弹窗的宽和高必须不能超出上级弹窗的宽和高,导致弹窗展示的大小受到限制,同时多层遮罩层叠加时越靠近底层的遮罩层颜色会逐渐加深,界面展示效果比较差。
发明内容
本申请的第一方面提供了一种弹窗展示方法,包括:
若接收到针对目标弹窗的展示指令,确定展示指令中目标弹窗的标识;
查询标识的上一级标识;
若查询到上一级标识,则确认当前展示页面的遮罩层中已展示有与上一级标识对应的弹窗;
在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗。
可选的,在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗,包括:
关闭上一级标识对应的弹窗;
在当前展示页面的遮罩层中展示目标弹窗。
可选的,在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗,包括:
在当前展示页面的遮罩层中展示目标弹窗,以使目标弹窗覆盖上一级标识对应的弹窗。
可选的,查询标识的上一级标识,包括:
获取至少两个弹窗的标识之间的排序;至少两个弹窗中包括目标弹窗;
基于排序,确定至少两个弹窗的标识中排序在目标弹窗的标识前一位的标识;
将前一位的标识作为上级标识。
可选的,在当前展示页面的遮罩层中展示目标弹窗之后,方法还包括:
检测到目标操作指令时,基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作。
可选的,若目标操作指令包括弹窗回退指令,则基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于弹窗回退指令,对目标弹窗进行关闭处理;
基于上一级标识对应的弹窗的、已渲染的页面内容,将上一级标识对应的弹窗展示于遮罩层中。
可选的,若目标操作指令包括关于弹窗关闭指令,则基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于弹窗关闭指令,关闭遮罩层中当前显示的目标弹窗。
可选的,若目标操作指令包括弹窗销毁指令,则基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于弹窗销毁指令中任一弹窗的标识,销毁任一弹窗对应的页面内容。
本申请的第二方面提供了一种弹窗展示装置,包括:
第一确定模块,用于若接收到针对目标弹窗的展示指令,确定展示指令中目标弹窗的标识;
查询模块,用于查询标识的上一级标识;
第二确定模块,用于若查询到上一级标识,则确认当前展示页面的遮罩层中已展示有与上一级标识对应的弹窗;
展示模块,用于在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗。
可选的,展示模块,具体用于:
关闭上一级标识对应的弹窗;
在当前展示页面的遮罩层中展示目标弹窗。
可选的,展示模块,具体用于:
在当前展示页面的遮罩层中展示目标弹窗,以使目标弹窗覆盖上一级标识对应的弹窗。
可选的,查询模块,具体用于:
获取至少两个弹窗的标识之间的排序;至少两个弹窗中包括目标弹窗;
基于排序,确定至少两个弹窗的标识中排序在目标弹窗的标识前一位的标识;
将前一位的标识作为上级标识。
可选的,该装置还包括处理模块;在展示模块在当前展示页面的遮罩层中展示目标弹窗之后;
处理模块,用于检测到目标操作指令时,基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作。
可选的,若目标操作指令包括弹窗回退指令,则处理模块,具体用于:
基于弹窗回退指令,对目标弹窗进行关闭处理;
基于上一级标识对应的弹窗的、已渲染的页面内容,将上一级标识对应的弹窗展示于遮罩层中。
可选的,若目标操作指令包括关于弹窗关闭指令,则处理模块,具体用于:
基于弹窗关闭指令,关闭遮罩层中当前显示的目标弹窗。
可选的,若目标操作指令包括弹窗销毁指令,则处理模块,具体用于:
基于弹窗销毁指令中任一弹窗的标识,销毁任一弹窗对应的页面内容。
本申请实施例的第三方面,提供了一种电子设备,该电子设备包括存储器和处理器;存储器中存储有计算机程序;处理器用于在运行计算机程序时执行第一方面及其可选的实施方式中任一项的方法。
本申请实施例的第四方面,提供了一种计算机可读存储介质,该计算机可读存储介质上存储有计算机程序,该程序被处理器执行时实现第一方面及其可选的实施方式中任一项的方法。
本申请提供的技术方案带来的有益效果是:
接收到针对目标弹窗的展示指令时,可以确定展示指令中目标弹窗的标识,从而可以查询该标识的上一级标识,如果查询到了上一级标识,则可以确认当前展示页面的遮罩层中已展示有该上一级标识对应的弹窗,从而可以在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗,可见,相对于现有多级弹窗的遮罩层逐渐嵌套而导致下一级弹窗的展示大小受到上级弹窗展示大小限制的方案,本申请可以只在遮罩层中展示目标弹窗而隐藏上一级标识对应的弹窗,这样目标弹窗的展示大小并不受上一级标识对应弹窗的大小限制,同时多个弹窗共用同一遮罩层,也避免了遮罩层叠加影响界面展示效果。
附图说明
为了更清楚地说明本申请实施例中的技术方案,下面将对本申请实施例描述中所需要使用的附图作简单地介绍。
图1为本申请弹窗展示方法的一个实施例示意图;
图2为本申请弹窗展示方法的一个场景示意图;
图3为本申请弹窗展示方法的另一个场景示意图;
图4为本申请弹窗展示方法的另一个场景示意图;
图5为本申请弹窗展示装置的结构示意图;
图6为本申请电子设备的结构示意图。
具体实施方式
下面详细描述本申请的实施例,实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,仅用于解释本申请,而不能解释为对本发明的限制。
本技术领域技术人员可以理解,除非特意声明,这里使用的单数形式“一”、“一个”、“”和“该”也可包括复数形式。应该进一步理解的是,本申请的说明书中使用的措辞“包括”是指存在特征、整数、步骤、操作、元件和/或组件,但是并不排除存在或添加一个或多个其他特征、整数、步骤、操作、元件、组件和/或它们的组。应该理解,当我们称元件被“连接”或“耦接”到另一元件时,它可以直接连接或耦接到其他元件,或者也可以存在中间元件。此外,这里使用的“连接”或“耦接”可以包括无线连接或无线耦接。这里使用的措辞“和/或”包括一个或更多个相关联的列出项的全部或任一单元和全部组合。
为使本申请的目的、技术方案和优点更加清楚,下面将结合附图对本申请实施方式作进一步地详细描述。
如上述,现有多级弹窗分别使用不同的遮罩层,多级弹窗的遮罩层逐渐嵌套的方案,会导致弹窗展示的大小受到限制,同时界面展示效果差。
进一步如果现有方案多个不同弹窗采用多个遮罩层,通过关闭某一遮罩层以及相应弹窗而只展示另一遮罩层以及相应弹窗,依然会具有如下缺点:先关闭一个遮罩层,再通过渲染以显示另一个遮罩层会产生视差,导致界面闪烁,同时,每次展示新的弹窗都需要重新渲染遮罩层,降低了弹窗展示的速度,加大了开发人员工作量。
为解决上述技术问题,本申请提供了一种弹窗展示方法,该方法具体可以由终端设备执行,该终端设备可以是台式终端也可以是移动终端,该方法包括:
步骤S101、若接收到针对目标弹窗的展示指令,确定展示指令中目标弹窗的标识;
终端设备接收到针对目标弹窗的展示指令时,可以确定该展示指令中所携带的目标弹窗的标识。
在本实施例中,针对目标弹窗的展示指令可以是用户输入的或终端设备自己生成的,针对目标弹窗的展示指令可以是:用户选择目标弹窗的入口链接或入口控件的指令。
步骤S102、查询标识的上一级标识;
终端设备可以查询该标识的上一级标识,在本实施例中,标识之间的级别关系用于指示标识对应的弹窗的展示顺序,即该标识对应的目标弹窗在该标识的上一级标识对应的弹窗之后展示。需要说明的是,标识之间的级别关系并不代表标识所对应的弹窗之间的级别关系。
步骤S103、若查询到上一级标识,则确认当前展示页面的遮罩层中已展示有与上一级标识对应的弹窗;
若终端设备查询到上一级标识,则表示该标识对应的目标弹窗并不是首先展示在当前展示页面的遮罩层中的弹窗,终端设备确认该上一级标识对应的弹窗当前正展示在展示页面的遮罩层中。
本申请中遮罩层是弹窗展示的载体,遮罩层一般叠加在网页页面之上,用于保证用户针对遮罩层中的弹窗进行操作时不会对网页页面产生影响。
步骤S104、在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗。
终端设备可以在当前展示页面的遮罩层中展示目标弹窗,这样可以用目标弹窗全部或部分隐藏遮罩层中上一级标识对应的弹窗,这时,遮罩层中的目标弹窗对于用户而言是完全可见的。
需要说明的是,若终端设备没有查询到上一级标识,表示该标识对应的目标弹窗为展示顺序排在首位的弹窗,则终端设备直接在当前展示页面的遮罩层中展示该目标弹窗即可。
可见,接收到针对目标弹窗的展示指令时,可以确定展示指令中目标弹窗的标识,从而可以查询该标识的上一级标识,如果查询到了上一级标识,则可以确认当前展示页面的遮罩层中已展示有该上一级标识对应的弹窗,从而可以在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗,可见,相对于现有多级弹窗的遮罩层逐渐嵌套而导致下一级弹窗的展示大小受到上级弹窗展示大小限制的方案,本申请可以只在遮罩层中展示目标弹窗而隐藏上一级标识对应的弹窗,这样目标弹窗的展示大小并不受上一级标识对应弹窗的大小限制,同时多个弹窗共用同一遮罩层,也避免了遮罩层叠加影响界面展示效果。
同时,本申请多个弹窗共用同一遮罩层,这样在展示目标弹窗时就不需要重新渲染遮罩层,可以统一处理遮罩层事件减少了开发工作量,加快了弹窗展示速度,也避免了界面闪烁。
进一步的,在本实施例中,隐藏上一级标识对应的弹窗有两种可能的实现方式:
一种可能的情况是,步骤S103在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗,可以包括:
关闭上一级标识对应的弹窗;
在当前展示页面的遮罩层中展示目标弹窗。
在本实施例中,如上述当前展示页面的遮罩层中已展示有与上一级标识对应的弹窗,则终端设备可以关闭遮罩层中该上一级标识对应的弹窗,同时在该当前展示页面的遮罩层中展示该目标弹窗,这种情况下,遮罩层中只展示有目标弹窗,这样可以实现隐藏上一级标识对应的弹窗的效果。
在本实施例中,关闭弹窗指的是关闭当前展示页面中该弹窗的页面,但是该页面对应的数据信息并没有删除,同时该弹窗的进程运行在终端设备后台。
可见,本申请的方案在展示某一标识对应的目标弹窗时,该会自动关闭该标识的上一级标识对应的弹窗,这样遮罩层中只会展示单一弹窗,弹窗的展示不受其他弹窗展示大小的限制。
同时,现有的方案有些设备只能支持两级弹窗的展示而无法支持多级弹窗的展示,本申请可以关闭上一级标识对应的弹窗而只在遮罩层中展示单一弹窗,这样可以自由展示多个弹窗,对弹窗个数无限制。
另一种可能的情况是,步骤S103在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗,可以包括:
在当前展示页面的遮罩层中展示目标弹窗,以使目标弹窗覆盖上一级标识对应的弹窗。
在本实施例中,终端设备还可以在当前展示页面的遮罩层中展示目标弹窗,用目标弹窗来完全覆盖或部分覆盖该上一级标识对应的弹窗,具体而言:
一种可实现的方式是:调整目标弹窗和/或上一级标识对应的弹窗的透明度,将上一级标识对应的弹窗调整为对用户不可见,而目标弹窗对于用户可见,这样从而可以用目标弹窗来覆盖该上一级标识对应的弹窗;
另一种可实现的方式是:上一级标识对应的弹窗以及目标弹窗用不同的图层展示,从而用上级标识对应的弹窗来全部或部分覆盖目标弹窗。
在本实施中,图层是指弹窗的图片层级,高图层的弹窗可以覆盖低图层的弹窗。
可见,这种情况下,遮罩层中实际上展示有目标弹窗以及上一级标识对应的弹窗,只是目标弹窗对用户可见,上一级标识对应的弹窗对用户不可见。
可见,本申请可以覆盖遮罩层中已展示有的上一级标识对应的弹窗而只在遮罩层中展示目标弹窗,这样目标弹窗的展示大小就不受上一级标识对应的弹窗的限制。
进一步的,上述目标弹窗与上一级标识对应的弹窗可以是同级弹窗,具体而言:
终端可以预先创建至少两个弹窗,该至少两个弹窗包括目标弹窗以及至少一个关联标识分别指示的弹窗,终端设备为各弹窗设置标识,并将至少两个弹窗分别对应的标识进行排序。标识的排序可以决定标识的级别顺序,从而可以决定标识所指示的弹窗的展示顺序。
在本实施例中,终端设备创建至少两个弹窗的方式是:终端设备构建文件对象模型(Document Object Model,DOM)树,选择dom树中至少两个同级节点作为弹窗的节点,通过该节点定义弹窗的样式(包括大小以及颜色等)、弹窗的内容以及弹窗的展示顺序,通过渲染该节点可以得到弹窗的页面,以此可以构建至少两个同级弹窗。
可见,本申请中弹窗之间是没有层级关系的,只是通过弹窗的标识来指示弹窗之间的展示顺序。
进一步的,步骤S102中查询标识的上一级标识,可以包括:
获取至少两个弹窗的标识之间的排序;至少两个弹窗中包括目标弹窗;
基于排序,确定至少两个弹窗的标识中排序在目标弹窗的标识前一位的标识;
将前一位的标识作为上级标识。
终端设备可以获取至少两个弹窗的标识,该至少两个弹窗的标识中包括目标弹窗的标识以及该标识的至少一个关联标识,终端设备确定至少两个弹窗的标识的排序,从而终端设备基于该排序可以确定至少两个弹窗的标识中排序在目标弹窗的标识前一位的标识,从而将该前一位的标识作为该上级标识,上级标识对应的弹窗就是在目标弹窗前面一位展示的弹窗。
例如,至少两个弹窗的标识之间的排序为1至N,目标弹窗的标识为第k位的标识,N为大于1的正整数,k的取值范围为(1,N],则目标弹窗的标识前一位的标识为第k-1位的标识,第k-1位的标识对应的弹窗就是在第k为的标识对应的弹窗前一位展示的弹窗。
可见,该实施例中弹窗之间是没有级别关系的,可以通过弹窗的标识来定义弹窗展示的流程顺序以逐个展示多个弹窗。
本申请的弹窗展示方法还支持弹窗的回退、关闭和销毁,具体而言:
可选的,在当前展示页面的遮罩层中展示目标弹窗之后,该方法还可以包括:
检测到目标操作指令时,基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作。
在本实施例中,终端设备检测到用户输入的或终端设备自动生成的目标操作指令时,可以基于该目标操作指令只针对目标弹窗进行操作,也可以针对目标弹窗以及上一级标识对应的弹窗进行操作。
具体的,一种可能的情况A:若目标操作指令包括弹窗回退指令,则:
其中,一种可能的情况a1是,基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于弹窗回退指令,对目标弹窗进行关闭处理;
基于上一级标识对应的弹窗的、已渲染的页面内容,将上一级标识对应的弹窗展示于遮罩层中。
本申请中默认的弹窗关闭方法为:关闭第n级标识对应的弹窗时会默认回到第n-1级标识对应的弹窗,n为正整数,则在本实施例中,弹窗回退指令可以是关闭目标弹窗的指令,终端设备可以基于弹窗回退指令关闭目标弹窗,同时关闭目标弹窗时终端设备自动回退到上一级标识对应的弹窗,这样遮罩层中只展示有上一级标识对应的弹窗。
同样的,关闭目标弹窗是指关闭当前展示页面中目标弹窗的页面,但是该页面的数据信息还是保存在终端设备中。
在本实施例中,回退到上一级标识对应的弹窗具体为:如上述,上一级标识对应弹窗的弹窗页面的数据信息并没有删除,则该终端设备可以基于该数据信息得到上一级标识对应的弹窗的、已渲染的页面内容,即上一级标识在dom树中对应的节点已渲染,从而基于该已渲染的页面内容将上一级标识对应的弹窗展示在遮罩层中,以此回退展示上一级标识对应的弹窗。
另一种可能的情况是a2是:本申请通过设置特定的弹窗关闭方法可以覆盖上述默认的弹窗关闭方法,可以关闭目标弹窗并回退到展示顺序在目标弹窗之前的任一弹窗,这样可以回到第n级标识之前任一级标识对应的弹窗,可以实现弹窗之间的自由跳转。
例如,关闭第5级标识对应的弹窗默认回到第4级标识对应的弹窗,本申请可以自定义弹窗关闭方法覆盖默认的弹窗关闭方法,可以实现关闭第5级标识对应的弹窗跳转回到第1至3级中任一级标识对应的弹窗。
请参照图2,本实施例的一种可能的场景是:终端设备检测到用户点击目标弹窗的“关闭”控件的操作时,可以关闭终端展示页面的遮罩层中的目标弹窗,并基于上一级标识对应的弹窗的已渲染的页面内容,在遮罩层中重新展示上一级标识对应的弹窗。
例如,一个登录弹窗的业务场景,当用户点击登录按钮时,首先展示“登录”弹窗,用户点击“忘记密码”,则展示下一弹窗页面“找回密码”弹窗,但是如果在这时用户想起来了密码,例如用户可以通过关闭“找回密码”弹窗,回退到“登录”弹窗。
另一种可能的情况是B是:若目标操作指令包括关于弹窗关闭指令,则基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于弹窗关闭指令,关闭遮罩层中当前显示的目标弹窗。
在本实施例中,终端设备若检测到弹窗关闭指令,该弹窗关闭指令中包括目标弹窗的标识以及排序在目标弹窗的标识之前的所有标识,可以理解的是,本申请在遮罩层中显示某一标识对应的弹窗时,均会关闭上一级标识对应的弹窗,则排序在目标弹窗的标识之前的所有标识中各标识所指示的弹窗均为曾经展示在遮罩层中、但是目前已关闭的弹窗,则终端设备可以基于该目标弹窗的标识关闭遮罩层当前显示的目标弹窗,同时,终端设备可以基于排序在目标弹窗的标识之前的所有标识将该所有标识分别对应的弹窗保持在关闭状态。可见,本申请可以一次性关闭遮罩层中的所有弹窗。
请参照图3,本实施例的一种可能的场景是:终端展示页面的遮罩层中展示有目标弹窗,终端设备检测到用户点击遮罩层的“关闭”控件的操作时,可以关闭终端展示页面的遮罩层中的目标弹窗,同时,将遮罩层中曾经展示的但是目前处于关闭状态的弹窗也保持在关闭状态,则此时终端设备回到没有开启弹窗之前的状态,终端展示页面上展示开启弹窗前的页面内容。
例如,一个登录弹窗的业务场景,当用户点击终端展示页面上的登录按钮时,首先展示“登录”弹窗,用户点击“忘记密码”,则展示下一弹窗页面“找回密码”弹窗,在“找回密码”弹窗页面中用户可以进入下一个页面,例如通过手机号找回时进入“接收验证码”弹窗页面,以此可以逐级进入接下来的弹窗,但是如果在这个过程中用户想起来了密码,用户可以点击遮罩层中的“关闭”控件则关闭所有弹窗,取消登录流程,回到终端展示页面(即上述网页页面)。
可见,本申请多个弹窗共用同一遮罩层,可以一次性关闭多个弹窗。
另一种可能的情况C是:若目标操作指令包括弹窗销毁指令,则基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于弹窗销毁指令中任一弹窗的标识,销毁任一弹窗对应的页面内容。
在本实施例中,如上述已关闭的弹窗其弹窗页面对应的数据信息实质上还是保存在终端设备中,则本申请终端设备在接收到弹窗销毁指令时,可以基于该弹窗销毁指令中任一弹窗(可以是目标弹窗或上一级标识对应的弹窗)的标识,删除该任一弹窗的页面内容对应的数据信息。
需要说明的是,若任一弹窗的数据信息销毁后,后续重新展示该弹窗时,需要重新渲染该弹窗在文件对象格式中的节点,以重新生成该弹窗的页面内容。
在本实施例中,可以销毁任一弹窗页面的数据信息,这样可以减轻设备的存储负担,同时该弹窗页面对应的进程也会相应的关闭,也减轻了设备的运行负担。
另一种可能的情况D是:目标操作指令还可以是弹窗切换指令,则终端设备在遮罩层中展示目标弹窗后,当检测到用户输入的弹窗切换指令时,终端设备可以确定该弹窗切换指令中携带的某一弹窗的标识,基于该某一弹窗的标识切换展示该某一弹窗,以使得该某一弹窗覆盖目标弹窗,这种情况下,可以选择关闭目标弹窗,也可以选择不关闭目标弹窗,只是用该某一弹窗覆盖目标弹窗。
在本实施例中,某一弹窗可以是展示顺序在目标弹窗之前的弹窗,即曾经展示在遮罩层的弹窗。
请参照图4,本实施例的一种可能的场景是:
当前展示在遮罩层中的弹窗为第n+1级标识对应的弹窗,同时第1级至第n级标识对应的弹窗为曾经展示在遮罩层中的弹窗,则遮罩层中展示有第1级至第n+1级标识,终端设备检测到用户点击第二级标识的操作时,可以切换展示该第二级标识对应的弹窗,这样终端设备可以切换回曾经展示过的任一弹窗,同样的,切换回该任一弹窗时,可以基于已渲染的该弹窗的页面内容展示该弹窗。
在本实施例中,对于已展示过的弹窗遮罩层中可以保留该弹窗的标识,这样终端设备可以切换回任一已展示过的弹窗,可以实现弹窗的自由切换,适用于更多的场景。
请参照图5,本申请还提供了一种弹窗展示装置,该装置包括:
第一确定模块501,用于若接收到针对目标弹窗的展示指令,确定展示指令中目标弹窗的标识;
查询模块502,用于查询标识的上一级标识;
第二确定模块503,用于若查询到上一级标识,则确认当前展示页面的遮罩层中已展示有与上一级标识对应的弹窗;
展示模块504,用于在当前展示页面的遮罩层中展示目标弹窗,以隐藏上一级标识对应的弹窗。
可选的,展示模块504,具体用于:
关闭上一级标识对应的弹窗;
在当前展示页面的遮罩层中展示目标弹窗。
可选的,展示模块504,具体用于:
在当前展示页面的遮罩层中展示目标弹窗,以使目标弹窗覆盖上一级标识对应的弹窗。
可选的,查询模块502,具体用于:
获取至少两个弹窗的标识之间的排序;至少两个弹窗中包括目标弹窗;
基于排序,确定至少两个弹窗的标识中排序在目标弹窗的标识前一位的标识;
将前一位的标识作为上级标识。
可选的,该装置还包括处理模块;在展示模块504在当前展示页面的遮罩层中展示目标弹窗之后;
处理模块,用于检测到目标操作指令时,基于目标操作指令对目标弹窗和/或上一级标识对应的弹窗进行相应的操作。
可选的,若目标操作指令包括弹窗回退指令,则处理模块,具体用于:
基于弹窗回退指令,对目标弹窗进行关闭处理;
基于上一级标识对应的弹窗的、已渲染的页面内容,将上一级标识对应的弹窗展示于遮罩层中。
可选的,若目标操作指令包括关于弹窗关闭指令,则处理模块,具体用于:
基于弹窗关闭指令,关闭遮罩层中当前显示的目标弹窗。
可选的,若目标操作指令包括弹窗销毁指令,则处理模块,具体用于:
基于弹窗销毁指令中任一弹窗的标识,销毁任一弹窗对应的页面内容。
由于本发明实施例所提供的装置为可以执行本发明实施例中相应的方法的装置,故而基于本发明实施例中所提供的方法,本领域所属技术人员能够了解本发明实施例的装置的具体实施方式以及其各种变化形式,所以在此对于该装置如何实现本发明实施例中的方法不再详细介绍。只要本领域所属技术人员实施本发明实施例中的方法所采用的装置,都属于本申请所欲保护的范围。
基于与图1中所示的方法相同的原理,本申请实施例还提供了一种电子设备,该电子设备包括存储器和处理器;存储器中存储有计算机程序;处理器用于在运行计算机程序时执行本申请任一可选实施例中所提供的方法。
本申请实施例还提供了一种计算机可读存储介质,该计算机可读存储介质上存储有计算机程序,该程序被处理器执行时可以实现本申请任一可选实施例中所提供的方法。
作为一示例,图6中示出了本申请可以应用于的一种电子设备4000的结构示意图,该电子设备包括存储器4003和处理器4001,存储器4003中存储有计算机程序,处理器4001,用于在运行计算机程序时执行上述任一方法。
具体的,该电子设备可以是终端、服务器或其他可能的设备,图6只是示出了电子设备的一种可选的示意性结构。图6中所示的该电子设备4000的结构并不构成对本申请实施例的限定。
其中,处理器4001和存储器4003相连,如通过总线4002相连。可选地,电子设备4000还可以包括收发器4004。需要说明的是,实际应用中收发器4004不限于一个,收发器4004可以具体用于该电子设备4000与其他设备的通信。
处理器4001可以是CPU(Central Processing Unit,中央处理器),通用处理器,DSP(Digital Signal Processor,数据信号处理器),ASIC(Application SpecificIntegrated Circuit,专用集成电路),FPGA(Field Programmable Gate Array,现场可编程门阵列)或者其他可编程逻辑器件、晶体管逻辑器件、硬件部件或者其任意组合。其可以实现或执行结合本申请申请内容所描述的各种示例性的逻辑方框,模块和电路。处理器4001也可以是实现计算功能的组合,例如包含一个或多个微处理器组合,DSP和微处理器的组合等。
总线4002可包括一通路,在上述组件之间传送信息。总线4002可以是PCI(Peripheral Component Interconnect,外设部件互连标准)总线或EISA(ExtendedIndustry Standard Architecture,扩展工业标准结构)总线等。总线4002可以分为地址总线、数据总线、控制总线等。为便于表示,图6中仅用一条粗线表示,但并不表示仅有一根总线或一种类型的总线。
存储器4003可以是ROM(Read Only Memory,只读存储器)或可存储静态信息和指令的其他类型的静态存储设备,RAM(Random Access Memory,随机存取存储器)或者可存储信息和指令的其他类型的动态存储设备,也可以是EEPROM(Electrically ErasableProgrammable Read Only Memory,电可擦可编程只读存储器)、CD-ROM(Compact DiscRead Only Memory,只读光盘)或其他光盘存储、光碟存储(包括压缩光碟、激光碟、光碟、数字通用光碟、蓝光光碟等)、磁盘存储介质或者其他磁存储设备、或者能够用于携带或存储具有指令或数据结构形式的期望的程序代码并能够由计算机存取的任何其他介质,但不限于此。
存储器4003用于存储执行本申请方案的应用程序代码,并由处理器4001来控制执行。处理器4001用于执行存储器4003中存储的应用程序代码,以实现上面任一方法实施例所示的内容。
应该理解的是,虽然附图的流程图中的各个步骤按照箭头的指示依次显示,但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明,这些步骤的执行并没有严格的顺序限制,其可以以其他的顺序执行。而且,附图的流程图中的至少一部分步骤可以包括多个子步骤或者多个阶段,这些子步骤或者阶段并不必然是在同一时刻执行完成,而是可以在不同的时刻执行,其执行顺序也不必然是依次进行,而是可以与其他步骤或者其他步骤的子步骤或者阶段的至少一部分轮流或者交替地执行。
以上仅是本发明的部分实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也应视为本发明的保护范围。

Claims (11)

1.一种弹窗展示方法,其特征在于,包括:
若接收到针对目标弹窗的展示指令,确定所述展示指令中目标弹窗的标识;
查询所述标识的上一级标识;
若查询到上一级标识,则确认所述当前展示页面的遮罩层中已展示有与所述上一级标识对应的弹窗;
在当前展示页面的遮罩层中展示所述目标弹窗,以隐藏所述上一级标识对应的弹窗。
2.根据权利要求1所述的方法,其特征在于,所述在当前展示页面的遮罩层中展示所述目标弹窗,以隐藏所述上一级标识对应的弹窗,包括:
关闭所述上一级标识对应的弹窗;
在所述当前展示页面的遮罩层中展示所述目标弹窗。
3.根据权利要求1所述的方法,其特征在于,所述在当前展示页面的遮罩层中展示所述目标弹窗,以隐藏所述上一级标识对应的弹窗,包括:
在当前展示页面的遮罩层中展示所述目标弹窗,以使所述目标弹窗覆盖所述上一级标识对应的弹窗。
4.根据权利要求1至3中任一项所述的方法,其特征在于,所述查询所述标识的上一级标识,包括:
获取至少两个弹窗的标识之间的排序;所述至少两个弹窗中包括所述目标弹窗;
基于所述排序,确定所述至少两个弹窗的标识中排序在所述目标弹窗的标识前一位的标识;
将所述前一位的标识作为所述上级标识。
5.根据权利要求2所述的方法,其特征在于,所述在所述当前展示页面的遮罩层中展示所述目标弹窗之后,所述方法还包括:
检测到目标操作指令时,基于所述目标操作指令对所述目标弹窗和/或上一级标识对应的弹窗进行相应的操作。
6.根据权利要求5所述的方法,其特征在于,若所述目标操作指令包括弹窗回退指令,则所述基于所述目标操作指令对所述目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于所述弹窗回退指令,对所述目标弹窗进行关闭处理;
基于所述上一级标识对应的弹窗的、已渲染的页面内容,将所述上一级标识对应的弹窗展示于所述遮罩层中。
7.根据权利要求5所述的方法,其特征在于,若所述目标操作指令包括关于弹窗关闭指令,则所述基于所述目标操作指令对所述目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于所述弹窗关闭指令,关闭所述遮罩层中当前显示的所述目标弹窗。
8.根据权利要求5所述的方法,其特征在于,若所述目标操作指令包括弹窗销毁指令,则所述基于所述目标操作指令对所述目标弹窗和/或上一级标识对应的弹窗进行相应的操作,包括:
基于所述弹窗销毁指令中任一弹窗的标识,销毁所述任一弹窗对应的页面内容。
9.一种弹窗展示装置,其特征在于,包括:
第一确定模块,用于若接收到针对目标弹窗的展示指令,确定所述展示指令中目标弹窗的标识;
查询模块,用于查询所述标识的上一级标识;
第二确定模块,用于若查询到上一级标识,则确认所述当前展示页面的遮罩层中已展示有与所述上一级标识对应的弹窗;
展示模块,用于在当前展示页面的遮罩层中展示所述目标弹窗,以隐藏所述上一级标识对应的弹窗。
10.一种电子设备,其特征在于,所述电子设备包括存储器和处理器;
所述存储器中存储有计算机程序;
所述处理器,用于在运行所述计算机程序时执行权利要求1-8中任一项所述的方法。
11.一种计算机可读存储介质,其特征在于,所述存储介质上存储有计算机程序,所述程序被处理器执行时实现权利要求1-8中任一项所述的方法。
CN202010949426.7A 2020-09-10 2020-09-10 弹窗展示方法、装置、电子设备及计算机可读存储介质 Active CN112099891B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010949426.7A CN112099891B (zh) 2020-09-10 2020-09-10 弹窗展示方法、装置、电子设备及计算机可读存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010949426.7A CN112099891B (zh) 2020-09-10 2020-09-10 弹窗展示方法、装置、电子设备及计算机可读存储介质

Publications (2)

Publication Number Publication Date
CN112099891A true CN112099891A (zh) 2020-12-18
CN112099891B CN112099891B (zh) 2024-01-12

Family

ID=73751285

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010949426.7A Active CN112099891B (zh) 2020-09-10 2020-09-10 弹窗展示方法、装置、电子设备及计算机可读存储介质

Country Status (1)

Country Link
CN (1) CN112099891B (zh)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113835800A (zh) * 2021-08-26 2021-12-24 北京金堤科技有限公司 弹窗的显示方法和装置、以及存储介质和电子设备
CN113900760A (zh) * 2021-10-26 2022-01-07 广州博冠信息科技有限公司 一种弹窗展示方法和装置
CN114489896A (zh) * 2022-01-20 2022-05-13 北京有竹居网络技术有限公司 内容显示方法、装置、存储介质及电子设备
WO2024046313A1 (zh) * 2022-08-30 2024-03-07 北京沃东天骏信息技术有限公司 一种前端业务逻辑的可视化处理方法、装置及系统

Citations (18)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100269030A1 (en) * 2009-04-17 2010-10-21 Jokaroo Entertainment Inc. Method and device for temporally displaying advertising content on a webpage
CN103064677A (zh) * 2012-12-24 2013-04-24 广东威创视讯科技股份有限公司 一种web多文档子窗口的管理方法及装置
CN106168978A (zh) * 2016-07-25 2016-11-30 腾讯科技(深圳)有限公司 一种网页中弹窗的处理方法和装置
CN106598967A (zh) * 2015-10-14 2017-04-26 北京国双科技有限公司 一种快速查询方法及装置
CN106648641A (zh) * 2016-12-09 2017-05-10 武汉斗鱼网络科技有限公司 一种iOS系统设备上多层弹框的自动管理方法和系统
US20170168685A1 (en) * 2015-12-15 2017-06-15 Le Holdings (Beijing) Co., Ltd. Method and electronic device for controlling terminal window display
CN106959855A (zh) * 2017-03-27 2017-07-18 福建中金在线信息科技有限公司 一种遮罩层的显示方法及装置
CN107179905A (zh) * 2017-04-01 2017-09-19 珠海市魅族科技有限公司 一种弹窗信息的展示方法和装置
CN108469972A (zh) * 2017-02-20 2018-08-31 阿里巴巴集团控股有限公司 支持web页面中显示多窗口的方法和装置
CN108958876A (zh) * 2018-07-23 2018-12-07 郑州云海信息技术有限公司 浏览器页面的显示方法和装置
CN109063202A (zh) * 2018-09-13 2018-12-21 北京三快在线科技有限公司 在混合界面应用中实现弹窗的方法、装置以及计算机设备
CN109558203A (zh) * 2018-12-14 2019-04-02 Oppo广东移动通信有限公司 最近内容的展示方法、装置、终端及存储介质
CN110020336A (zh) * 2017-08-01 2019-07-16 北京国双科技有限公司 遮罩层控制方法及装置
CN110362304A (zh) * 2018-03-26 2019-10-22 北京京东尚科信息技术有限公司 网页显示的方法和装置
CN110688189A (zh) * 2019-09-30 2020-01-14 北京拉勾网络技术有限公司 一种弹框的显示方法、装置及存储介质
CN111090431A (zh) * 2019-11-29 2020-05-01 亚信科技(南京)有限公司 一种数据处理方法及装置
CN111125433A (zh) * 2019-12-13 2020-05-08 珠海格力电器股份有限公司 一种弹窗管理方法、装置、电子设备及可读存储介质
CN111597008A (zh) * 2020-05-22 2020-08-28 广州酷狗计算机科技有限公司 弹窗管理方法、装置、终端及存储介质

Patent Citations (18)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100269030A1 (en) * 2009-04-17 2010-10-21 Jokaroo Entertainment Inc. Method and device for temporally displaying advertising content on a webpage
CN103064677A (zh) * 2012-12-24 2013-04-24 广东威创视讯科技股份有限公司 一种web多文档子窗口的管理方法及装置
CN106598967A (zh) * 2015-10-14 2017-04-26 北京国双科技有限公司 一种快速查询方法及装置
US20170168685A1 (en) * 2015-12-15 2017-06-15 Le Holdings (Beijing) Co., Ltd. Method and electronic device for controlling terminal window display
CN106168978A (zh) * 2016-07-25 2016-11-30 腾讯科技(深圳)有限公司 一种网页中弹窗的处理方法和装置
CN106648641A (zh) * 2016-12-09 2017-05-10 武汉斗鱼网络科技有限公司 一种iOS系统设备上多层弹框的自动管理方法和系统
CN108469972A (zh) * 2017-02-20 2018-08-31 阿里巴巴集团控股有限公司 支持web页面中显示多窗口的方法和装置
CN106959855A (zh) * 2017-03-27 2017-07-18 福建中金在线信息科技有限公司 一种遮罩层的显示方法及装置
CN107179905A (zh) * 2017-04-01 2017-09-19 珠海市魅族科技有限公司 一种弹窗信息的展示方法和装置
CN110020336A (zh) * 2017-08-01 2019-07-16 北京国双科技有限公司 遮罩层控制方法及装置
CN110362304A (zh) * 2018-03-26 2019-10-22 北京京东尚科信息技术有限公司 网页显示的方法和装置
CN108958876A (zh) * 2018-07-23 2018-12-07 郑州云海信息技术有限公司 浏览器页面的显示方法和装置
CN109063202A (zh) * 2018-09-13 2018-12-21 北京三快在线科技有限公司 在混合界面应用中实现弹窗的方法、装置以及计算机设备
CN109558203A (zh) * 2018-12-14 2019-04-02 Oppo广东移动通信有限公司 最近内容的展示方法、装置、终端及存储介质
CN110688189A (zh) * 2019-09-30 2020-01-14 北京拉勾网络技术有限公司 一种弹框的显示方法、装置及存储介质
CN111090431A (zh) * 2019-11-29 2020-05-01 亚信科技(南京)有限公司 一种数据处理方法及装置
CN111125433A (zh) * 2019-12-13 2020-05-08 珠海格力电器股份有限公司 一种弹窗管理方法、装置、电子设备及可读存储介质
CN111597008A (zh) * 2020-05-22 2020-08-28 广州酷狗计算机科技有限公司 弹窗管理方法、装置、终端及存储介质

Non-Patent Citations (6)

* Cited by examiner, † Cited by third party
Title
DFR: "CSS popup layer size relative to window size", Retrieved from the Internet <URL:https://stackoverflow.com/questions/18098562/css-popup-layer-size-relative-to-window-size> *
DIMTDJ: "multiple popups on same page", Retrieved from the Internet <URL:https://www.codeproject.com/Questions/604956/multiplepluspopupsplusonplussamepluspage> *
京东设计中心JDC: "组件popup的设计和源码剖析", Retrieved from the Internet <URL:https://www.sohu.com/a/405576396_487492> *
卢浮宫丶晓: "弹窗遮罩层原理及实现", Retrieved from the Internet <URL:https://blog.csdn.net/qq_25175063/article/details/70739839> *
多写文章能生发: "一层弹出层、两层弹出层、三层弹出层、多层弹出层随便搞", Retrieved from the Internet <URL:https://blog.csdn.net/sun_luming/article/details/104303064> *
子善: "CSS实现带遮罩层可关闭的弹窗效果", Retrieved from the Internet <URL:https://www.jb51.net/css/715705.html> *

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113835800A (zh) * 2021-08-26 2021-12-24 北京金堤科技有限公司 弹窗的显示方法和装置、以及存储介质和电子设备
CN113835800B (zh) * 2021-08-26 2023-04-14 北京金堤科技有限公司 弹窗的显示方法和装置、以及存储介质和电子设备
CN113900760A (zh) * 2021-10-26 2022-01-07 广州博冠信息科技有限公司 一种弹窗展示方法和装置
CN113900760B (zh) * 2021-10-26 2024-05-28 广州博冠信息科技有限公司 一种弹窗展示方法和装置
CN114489896A (zh) * 2022-01-20 2022-05-13 北京有竹居网络技术有限公司 内容显示方法、装置、存储介质及电子设备
CN114489896B (zh) * 2022-01-20 2024-04-30 北京有竹居网络技术有限公司 内容显示方法、装置、存储介质及电子设备
WO2024046313A1 (zh) * 2022-08-30 2024-03-07 北京沃东天骏信息技术有限公司 一种前端业务逻辑的可视化处理方法、装置及系统

Also Published As

Publication number Publication date
CN112099891B (zh) 2024-01-12

Similar Documents

Publication Publication Date Title
CN112099891A (zh) 弹窗展示方法、装置、电子设备及计算机可读存储介质
CN103593107A (zh) 界面显示方法及装置
CN113421144A (zh) 一种页面显示方法及装置、设备、存储介质
CN104657668A (zh) 一种终端
US10331800B2 (en) Search results modulator
KR20070029104A (ko) 디스플레이되는 계층적 데이터 구조를 통한 네비게이팅
CN104657991A (zh) 一种图片处理的方法
CN112256255B (zh) 一种电子地图图层动态配置展示方法及系统
CN111381745B (zh) 页面切换方法、装置、设备
CN112988810B (zh) 信息查找方法、装置及设备
CN115544981A (zh) 文档处理方法、装置、电子设备、存储介质及程序产品
US11330338B2 (en) Method and system of displaying video comments, computing device, and readable storage medium
CN114791984A (zh) 导航树显示方法、导航树显示装置和电子设备
CN114168543A (zh) 文件处理方法、装置和电子设备
CN109254985A (zh) 数据库的数据展示方法及装置、电子设备
CN113779288A (zh) 照片存储方法及装置
CN113360692A (zh) 轮播视图的展示方法与系统
CN108647197B (zh) 一种信息处理方法、装置及存储介质
CN111984809A (zh) 一种图像查找方法和相关装置
CN115129198B (zh) 一种数据获取方法、装置、电子设备及存储介质
CN114415878B (zh) 数据处理方法、装置、电子设备及计算机可读存储介质
CN116339813A (zh) 基于低代码平台的组件属性配置方法、装置及电子设备
CN102043782A (zh) 依据编码建立索引的查找系统及其方法
CN116304210A (zh) 一种数据展示方法、装置、计算机设备及存储介质
CN106155655A (zh) 一种应用程序的管理方法和装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant