[发明专利]一种对页面元素进行锁定的方法及装置

说明书

技术领域

本发明涉及网络通信领域，特别涉及一种对页面元素进行锁定的方法及装置。

背景技术

在进行网页(web)用户界面(user interface，ui)开发的时候，经常会遇到需要禁止用户点击某些界面元素(页面元素)，即对页面元素进行锁定的需求。在标准的超文本标记语言(Hyper Text Markup Language，HTML)中，只有表单(form)元素标签可以使用禁用(disabled)属性，例如，对于表单中的输入框(input)和选择框(select)等控件，开发人员可以直接通过设置disabled属性将其禁用。

由于ui控件和产品需求的多样性，很多时候需要禁用网页中的一些链接或者其它ui控件。但对于普通的链接，需要根据事件绑定的方式，来单独为每一个需要禁用的链接元素编写禁用代码；而对于自行开发或者第三方开发的ui控件，则需要修改源代码，才能添加“禁止用户点击”的功能。

可见，现有技术对网页中的页面元素进行锁定的实现方式比较复杂，需要进一步改进和完善。

发明内容

有鉴于此，本发明的目的是提供一种对页面元素进行锁定的方法及装置，能够以简单的方式实现对页面中的任意页面元素的锁定。

为实现上述目的，本发明提供技术方案如下：

一种对页面元素进行锁定的方法，包括：

获取待锁定的页面元素的宽度、高度和所述页面元素相对于页面左上角的第一偏移值；

在指定节点下生成高度为0的遮盖层容器；

获取所述遮盖层容器相对于页面左上角的第二偏移值；

在所述遮盖层容器下生成透明的遮盖层，所述遮盖层采用层叠样式表的绝对定位属性，其宽度、高度为所述页面元素的宽度、高度，其相对于遮盖层容器左上角的偏移值为所述第一偏移值与所述第二偏移值之差，其z-index值大于所述页面元素的z-index值。

上述的方法，其中，还包括：将所述页面元素设置为半透明。

上述的方法，其中：所述指定节点为所述页面元素的父元素。

上述的方法，其中，还包括：当所述指定节点为body节点时，将所述遮盖层容器的宽度设置为页面实际内容的宽度，将所述遮盖层容器的对齐方式设置为与页面实际内容的对齐方式相同。

上述的方法，其中：当所述页面元素为子界面元素时，所述指定节点为所述子界面元素的直接父元素。

一种对页面元素进行锁定的装置，包括：

第一获取单元，用于获取待锁定的页面元素的宽度、高度和所述页面元素相对于页面左上角的第一偏移值；

遮盖层容器生成单元，用于在指定节点下生成高度为0的遮盖层容器；

第二获取单元，用于获取所述遮盖层容器相对于页面左上角的第二偏移值；

遮盖层生成单元，用于在所述遮盖层容器下生成透明的遮盖层，所述遮盖层采用层叠样式表的绝对定位属性，其宽度、高度为所述页面元素的宽度、高度，其相对于遮盖层容器左上角的偏移值为所述第一偏移值与所述第二偏移值之差，其z-index值大于所述页面元素的z-index值。

上述的装置，其中，还包括：设置单元，用于将所述页面元素设置为半透明。

上述的装置，其中：所述指定节点为所述页面元素的父元素。

上述的装置，其中，所述遮盖层容器生成单元进一步用于：当所述指定节点为body节点时，将所述遮盖层容器的宽度设置为页面实际内容的宽度，将所述遮盖层容器的对齐方式设置为与页面实际内容的对齐方式相同。

上述的装置，其中：当所述页面元素为子界面元素时，所述指定节点为所述子界面元素的直接父元素。。

与现有技术需要为每个禁用的页面元素分别编写禁用代码相比，本发明为所有的html标签提供了一个锁定(lock)方法，在该lock方法中，通过创建一个遮盖层元素，将目标页面元素遮挡，从而产生“被禁用”的效果，如此，以简单的方式实现了对页面中的任意页面元素的锁定。

附图说明

图1是根据本发明实施例的对页面元素进行锁定的方法流程图；

图2是根据本发明实施例的对页面元素进行锁定的装置结构图；

图3是本发明实施例中对页面元素进行锁定前的页面示意图；

图4是本发明实施例中对页面元素进行锁定后的页面示意图。

具体实施方式

以下结合附图对本发明进行详细描述。