CN103853712A

CN103853712A - 一种浮动层窗口的显示方法及浏览器

Info

Publication number: CN103853712A
Application number: CN201210495004.2A
Authority: CN
Inventors: 李跃
Original assignee: Kingdee Software China Co Ltd
Current assignee: Kingdee Software China Co Ltd
Priority date: 2012-11-28
Filing date: 2012-11-28
Publication date: 2014-06-11

Abstract

本发明实施例公开了一种浮动层窗口的显示方法及浏览器。本发明实施例方法包括：若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，窗口参数至少包括窗体创建参数及页面加载参数；按照窗体创建参数创建浮动层窗口的窗体，显示浮动层窗口的窗体；按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示，使得浏览器能够有效的支持浮动层窗口的内部页面的加载，提高用户体验。

Description

一种浮动层窗口的显示方法及浏览器

技术领域

本发明涉及互联网领域，尤其涉及一种浮动层窗口的显示方法及浏览器。

背景技术

浏览器是指可以显示网页服务器或者本地文件系统的图形界面化用户操作界面的软件程序，计算机应用的浏览器一般是作为用户和计算机的接口，接收键盘或鼠标的命令，基于操作系统的界面化显示结算及保存的文件或者基于超文本标记语言（Hypertext Markup Language，HTML）语言的内容。

网页弹出窗口由于经常被浏览器设置为屏蔽而无法打开，但是弹出窗体的形式又被广泛接受和要求，所以产生了通过浮动层块（DIVision，DIV）的方式模拟弹出窗口的形式，该类窗口可称为浮动层窗口，且浮动层窗口实质是作为当前网页文档的一部分存在的。

目前主流的网页浮动层窗口包含以jQuery技术为基础的jQuery.ui.dialog插件和easyUI.window.js插件、及ExtJs提供的窗（window）控件等。其中，jQuery是一个快速、简单的Java脚本库（JavaScript library），它简化了超文本标记语言（Hypertext Markup Language，HTML）文件的解析（traversing），事件处理、动画、异步JavaScript和XML（Asynchronous JavaScript and XML，Ajax）互动，从而方便了网页制作的快速发展，jQuery是为了改变JavaScript而设计的，可通过插件函数的方式实现对HTML控件提供各种自定义的功能的目的。

然而，目前的浮动层窗口在以DIV方式模拟弹出窗体后，不支持窗口的内部页面的加载，将出现只显示浮动层窗口的窗体，而浮动层窗口的内部页面因不能加载而导致的窗口内容空白的情况，降低了用户体验。

发明内容

本发明实施例提供了一种浮动层窗口的显示方法及浏览器，用于实现浮动层窗口的内部页面的加载。

本发明实施例中提供了一种浮动层窗口的显示方法，包括：

若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，所述窗口参数至少包括窗体创建参数及页面加载参数；

按照所述窗体创建参数创建所述浮动层窗口的窗体，显示所述浮动层窗口的窗体；

按照所述页面加载参数加载所述浮动层窗口的内部页面，完成所述浮动层窗口的显示。

本发明实施例中提供了一种浏览器，包括：

调用单元，用于若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，所述窗口参数至少包括窗体创建参数及页面加载参数；

创建及显示单元，用于在所述调用单元获取窗口参数之后，按照所述窗体创建参数创建所述浮动层窗口的窗体，显示所述浮动层窗口的窗体；

加载单元，用于在所述创建及显示单元显示所述浮动层窗口的窗体之后，按照所述页面加载参数加载所述浮动层窗口的内部页面，完成所述浮动层窗口的显示。

从以上技术方案可以看出，本发明实施例具有以下优点：

若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，该窗口参数中至少包括窗体创建参数及页面加载参数，且按照该窗体创建参数创建浮动层窗口的窗体，显示该浮动层窗口的窗体，并按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示，使得浏览器能够有效的支持浮动层窗口的内部页面的加载，提高用户体验。

附图说明

图1为本发明实施例中一种浮动层窗口的显示方法的一个示意图；

图2为本发明实施例中一种浮动层窗口的显示方法的另一示意图；

图3为本发明实施例中浏览器的结构的一个示意图；

图4为本发明实施例中浏览器的结构的另一示意图。

具体实施方式

本发明实施例提供了一种浮动层窗口的显示方法及浏览器，用于浏览器实现浮动层窗口的显示，且能够有效的支持浮动层窗口的内部页面的加载，提高用户的体验。

请参阅图1，为本发明实施例中一种浮动层窗口的显示方法的实施例，包括：

101、若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，窗口参数至少包括窗体创建参数及页面加载参数；

在本发明实施例中，用户在使用浏览器浏览页面时，可能会触发浮动层窗口的生成及显示，形成浮动层窗口的触发指令，例如：用户在浏览论坛时需要发表意见，在用户点击提交按钮之后，浏览器检测该用户未登陆论坛，则中断提交操作，且生成浮动层窗口的触发指令，使得浏览器检测到该触发指令之后显示浮动层窗口，且在该浮动层窗口中显示用户登陆页面，以提醒用户需要登陆之后才能发表评论。又例如：用户想登陆某购物网站，则点击页面上的登陆按钮，用户的该点击操作将生成浮动层窗口的触发指令，浏览器检测到该浮动层窗口的触发指令之后，将以浮动层窗口的形式显示登陆页面。

在本发明实施例中，若检测到浮动层窗口的触发指令，则浏览器将调用open方法获取预置的窗口参数，该窗口参数至少包括窗体创建参数及页面加载参数。

其中，窗体创建参数可用于创建浮动层窗口的窗体，可包括：窗口的大小、位置、拖动、显示或隐藏、模态窗体（model）的属性。

其中，页面加载参数包括：统一资源定位符（RUL，Uniform/UniversalResource Locator）属性，容器类型（openType）属性，访问方式（method）属性，数据（data）属性等等。

优选的，页面加载参数中还可包括页面加载完成后（opencompleted）回调函数，窗体关闭前（beforeClose）函数。

102、按照窗体创建参数创建浮动层窗口的窗体，显示浮动层窗口的窗体；

在本发明实施例中，浏览器将按照窗体创建参数创建浮动层窗口的窗体，显示该创建的浮动层窗口的窗体。

需要说明的是，在本发明实施例中，若窗体创建参数中的模态窗体的属性的值为真，则在步骤102之后，浏览器还将在浮动层窗口的窗体所覆盖的窗口上生成遮罩层，以避免用户对该遮罩层所屏蔽的窗口的操作。

103、按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示。

在本发明实施例中，浏览器还将按照页面加载参数加载浮动层窗口的内部页面，以完成浮动层窗口的显示。

在本发明实施例中，浏览器检测到浮动层窗口的触发指令后，将调用open方法获取预置的窗口参数，并按照窗口参数中的窗体创建参数创建浮动层窗口的窗体，显示该浮动层窗口的窗体，且还将按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示，其中，通过调用open方法获得窗口参数，能够有效的支持浮动层窗口的内部页面的加载，提高用户的体验。

为了更好的理解本发明实施例中浮动层窗口的显示方法，请参阅图2，为本发明实施例中浮动层窗口的显示方法的实施例，包括：

201、若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，窗口参数至少包括窗体创建参数及页面加载参数；

步骤201与图1所示实施例中的步骤101描述的内容相似，此处不再赘述。

202、按照窗体创建参数创建浮动层窗口的窗体，显示浮动层窗口的窗体；

步骤202与图1所示实施例中的步骤102描述的内容相似，此处不再赘述。

203、若窗体创建参数中的模态窗体的属性的值为真，在浮动层窗口的窗体所覆盖的窗口上生成遮罩层。

在本发明实施例中，浏览器在显示浮动层窗口的窗体之后，还将根据窗体创建参数中的模态窗体的属性确定是否需要生成遮罩层，若模态窗体的属性的值为真，则在浮动层窗口的窗体所覆盖的窗口上生成遮罩层，若模态窗体的属性的值为非真，则不生成遮罩层，且通过生成遮罩层，可以避免用户对遮罩层下的窗口的操作，同时可以提醒用户遮罩层下的窗口当前是不可操作的。

需要说明的是，在本发明实施例中，若窗体创建参数中的模态窗体的属性的值为非真，则执行步骤202之后，执行步骤204或者205。

204、若页面加载参数中设置通过DIV方式加载浮动层窗口的内部页面，则通过DIV方式加载浮动层窗口的内部页面；

205、若页面加载参数中设置通过Iframe方式加载浮动层窗口的内部页面，则通过Iframe方式加载浮动层窗口的内部页面。

在本发明实施例中，浏览器将按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示。

具体的，页面加载参数中包含URL、openType属性、method属性、data属性、opencompleted回调函数，beforeClose函数。

在本发明实施例中，openType属性的设置是用于指示浮动层窗口的内部页面是通过DIV方式加载还是通过内部框架（Inner Frame，IFrame）方式加载，其中，通过IFrame方式加载浮动层窗口的内部页面的优势在于IFrame页面是独立于主页面的文档树，能够避免IFrame页面与主页面之间的干扰。且若页面加载参数中openType属性设置为通过DIV方式加载浮动层窗口的内部页面，则浏览器将通过DIV方式加载浮动层窗口的内部页面，若页面加载参数中的openType属性设置为通过IFrame方式加载浮动层窗口的内部页面，则浏览器将通过IFrame方式加载浮动层窗口的内部页面。

此外，浏览器在确定是使用DIV方式或者IFrame方式加载浮动层窗口的内部页面之后，还将按照method属性确定具体的操作方式，其中，method属性的设置是用于指示在具体执行加载时是通过get方式加载还是通过post方式加载，其中post方式加载的优势在于参数大小没有限制。

具体的，在通过DIV方式中的get方式加载浮动层窗口的内部页面时，需要先在已显示的浮动层窗口的窗体中创建一个浮动层容器，再通过get方式加载指定的URL。

在通过DIV方式中的post方式加载浮动层窗口的内部页面时，需要先在已显示的浮动层窗口的窗体中创建一个浮动层容器，再通过post方式加载指定的URL。

在通过IFrame方式中的get方式加载浮动层窗口的内部页面时，需要先在已显示的浮动层窗口的窗体中创建一个IFrame元素，再通过get方式加载指定的URL。

在通过IFrame方式中的post方式加载浮动层窗口的内部页面时，需要先在已显示的浮动层窗口的窗体中创建一个IFrame元素，再在该IFrame元素中添加一个form表单，其中，该form表单中的method属性为post、target属性为该IFrame元素的身份标识码（Identity，ID），action属性为URL参数，且将在该form表单中建立一个input元素，将data属性中的参数写入iput元素中，最后提交该form表单，以达到通过IFrame方式中的pst方式实现浮动层窗口的内部页面加载的目的，需要说明的是，在完成内部页面的加载之后，需要删除该form表单。

206、若检测到浮动层窗口的关闭指令，则关闭浮动层窗口。

在本发明实施例中，用户可通过操作关闭浏览器页面上的浮动层窗口，例如：若用户通过浮动层窗口登陆网站，则在用户输入相关信息后，可通过击确认按钮提交登陆信息，浏览器接收到提交信息且确认信息正确之后，将生成浮动层窗口的关闭指令，使得在浏览器检测到浮动层窗口的关闭指令之后，关闭浮动层窗口。又例如：用户可通过点击浮动层窗口上的关闭按钮，用户的点击操作将生成浮动层窗口的关闭指令，浏览器检测到该浮动层窗口的关闭指令之后，将关闭浮动层窗口。

因此，在本发明实施例中，若浏览器检测到浮动层窗口的关闭指令，则关闭浮动层窗口，需要说明的是，若该浮动层窗口所覆盖的窗口上添加了遮罩层，则浏览器在关闭该浮动层窗口之后还将关闭该遮罩层。

本发明实施例中，若浏览器检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，按照窗口参数中的窗体创建参数创建浮动层窗口的窗体，且显示该浮动层窗口的窗体，且在模态窗体的属性的值为真时在浮动层窗口的窗体所覆盖的窗口上生成遮罩层，在显示窗体之后，若窗口参数中的页面加载参数中设置通过DIV方式加载浮动层窗口的内部页面，则浏览器通过DIV方式加载浮动层窗口的内部页面，若页面加载参数中设置通过IFrame方式加载浮动层窗口的内部页面，则通过IFrame方式加载浮动层窗口的内部页面，因此，通过调用open方法获得窗口参数并显示浮动层窗口的方式能够有效的支持浮动层窗口的内部页面的加载，满足用户的需求，提高用户的体验。

请参阅图3，为本发明实施例中的浏览器的结构的实施例，包括：

调用单元301，用于若检测到浮动层窗口的触发指令，则调用open方法获取预置的窗口参数，窗口参数至少包括窗体创建参数及页面加载参数；

创建及显示单元302，用于在调用单元301获取窗口参数之后，按照窗体创建参数创建浮动层窗口的窗体，显示浮动层窗口的窗体；

加载单元303，用于在创建及显示单元302显示浮动层窗口的窗体之后，按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示。

在本发明实施例中，若浏览器检测到浮动层窗口的触发指令，则调用单元301调用open方法获取预置的窗口参数，该窗口参数中至少包含窗体创建参数及页面加载参数，接着创建及显示单元302将按照窗体创建参数创建浮动层窗口的窗体，显示浮动层窗口的窗体，最后，加载单元303将按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示。

为了更好的理解本发明实施例中的浏览器，请参阅图4，为本发明实施例中浏览器的结构的实施例，包括：

调用单元301、创建及显示单元302、加载单元303，且与图3所示实施例中描述的内容相似，此处不再赘述。

在本发明实施例中，浏览器还包括：

生成单元401，用于若窗体创建参数中的模态窗体的属性的值为真，在浮动层窗口的窗体所覆盖的窗口上生成遮罩层。

在本发明实施例中，加载单元303包括：

第一加载单元402，用于若页面加载参数中设置通过DIV方式加载浮动层窗口的内部页面，则通过DIV方式加载浮动层窗口的内部页面；

第二加载单元403，用于若页面加载参数中设置通过Iframe方式加载浮动层窗口的内部页面，则通过Iframe方式加载浮动层窗口的内部页面。

此外，在本发明实施例中，浏览器还包括：

关闭单元404，用于若检测到浮动层窗口的关闭指令，则关闭浮动层窗口。

在本发明实施例中，

在本发明实施例中，若浏览器检测到浮动层窗口的触发指令，则调用单元301调用open方法获取预置的窗口参数，该窗口参数中至少包含窗体创建参数及页面加载参数，接着创建及显示单元302将按照窗体创建参数创建浮动层窗口的窗体，显示浮动层窗口的窗体，且若窗体创建参数中的模态窗体的属性的值为真，则生成单元401在浮动层窗口的窗体所覆盖的窗口上生成遮罩层。最后，加载单元303将按照页面加载参数加载浮动层窗口的内部页面，完成浮动层窗口的显示。具体包括：若页面加载参数中设置通过DIV方式加载浮动层窗口的内部页面，则加载单元303中的第一加载单元402通过DIV方式加载浮动层窗口的内部页面，若页面加载参数中设置通过IFrame方式加载浮动层窗口的内部页面，则通过IFrame方式记载浮动层窗口的内部页面。且若检测到浮动层窗口的关闭指令，则关闭单元404光比浮动层窗口。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，上述提到的存储介质可以是只读存储器，磁盘或光盘等。

以上对本发明所提供的一种浮动层窗口的显示方法及浏览器进行了详细介绍，对于本领域的一般技术人员，依据本发明实施例的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

Claims

1.一种浮动层窗口的显示方法，其特征在于，包括：

2.根据权利要求1所述的显示方法，其特征在于，若所述窗体创建参数中的模态窗体的属性的值为真，则所述按照所述窗体创建参数创建所述浮动层窗口的窗体，显示所述浮动层窗口的窗体之后还包括：

在所述浮动层窗口的窗体所覆盖的窗口上生成遮罩层。

3.根据权利要求1或2所述的显示方法，其特征在于，所述按照所述页面加载参数加载所述浮动层窗口的内部页面包括：

若所述页面加载参数中设置通过块DIV方式加载所述浮动层窗口的内部页面，则通过DIV方式加载所述浮动层窗口的内部页面；

若所述页面加载参数中设置通过内部框架Iframe方式加载所述浮动层窗口的内部页面，则通过Iframe方式加载所述浮动层窗口的内部页面。

4.根据权利要求3中所述的显示方法，其特征在于，

所述通过DIV方式加载所述浮动层窗口的内部页面包括：通过DIV方式中的get方式或者post方式加载所述浮动层窗口的内部页面；

所述通过所述Iframe方式加载所述浮动层窗口的内部页面包括：通过IFrame方式中的get方式或者post方式加载所述浮动层窗口的内部页面。

5.根据权利要求1或2所述的显示方法，其特征在于，所述显示方法还包括：

若检测到浮动层窗口的关闭指令，则关闭所述浮动层窗口。

6.一种浏览器，其特征在于，包括：

7.根据权利要求6所述的浏览器，其特征在于，若所述窗体创建参数中的模态窗体的属性的值为真，则所述浏览器还包括：

生成单元，用于在所述创建及显示单元显示所述浮动层窗口的窗体之后，在所述浮动层窗口的窗体所覆盖的窗口上生成遮罩层。

8.根据权利要求6或7所述的显示方法，其特征在于，所述加载单元包括：

第一加载单元，用于若所述页面加载参数中设置通过DIV方式加载所述浮动层窗口的内部页面，则通过DIV方式加载所述浮动层窗口的内部页面；

第二加载单元，用于若所述页面加载参数中设置通过Iframe方式加载所述浮动层窗口的内部页面，则通过Iframe方式加载所述浮动层窗口的内部页面。

9.根据权利要求6或7所述的显示方法，其特征在于，所述浏览器还包括：

关闭单元，用于若检测到浮动层窗口的关闭指令，则关闭所述浮动层窗口。