[发明专利]实现鼠标事件穿透的方法、相关存储介质、设备和装置

权利要求书

1.一种实现鼠标事件穿透的方法，其特征在于，包括如下步骤：

S1，检测是否存在上层DOM元素；

S2，若存在所述上层DOM元素，则设置Canvas元素层的CSS属性，以使所述Canvas元素层不响应鼠标事件，此时，所述上层DOM元素响应鼠标事件；若不存在所述上层DOM元素，则执行步骤S3；

S3，检测鼠标坐标的位置；

S4，若所述鼠标坐标在所述Canvas元素层的子元素的范围内，则设置所述子元素的CSS属性，使所述子元素响应鼠标事件；若所述鼠标坐标的位置不在所述Canvas元素层的子元素范围内，则设置所述Canvas元素层的CSS属性，使所述Canvas元素层不响应鼠标事件，此时，下层DOM元素响应鼠标事件。

2.如权利要求1所述的方法，其特征在于，步骤S1进一步包括：

S11，利用elementFormPoint全局函数获取鼠标当前位置的第一个元素；

S12，判断所述第一个元素是否属于所述Canvas元素层；

S13，若所述第一个元素属于所述Canvas元素层，则说明不存在上层DOM元素；若所述第一个元素不属于所述Canvas元素层，则说明存在上层DOM元素。

3.如权利要求1所述的方法，其特征在于，步骤S3进一步包括：

S31，获取鼠标当前位置的全局坐标；

S32，将所述全局坐标转换为相对于所述Canvas元素层的相对坐标。

4.如权利要求3所述的方法，其特征在于，步骤S4进一步包括：

利用isPointInPath方法检测所述相对坐标是否在所述Canvas元素层的子元素的范围内。

5.如权利要求1所述的方法，其特征在于，步骤S4进一步包括：

所述子元素响应鼠标事件时，设置相应的鼠标指针。

6.如权利要求1所述的方法，其特征在于，若存在所述上层DOM元素，将所述Canvas元素层的CSS属性中的pointer-events设置成none，使所述Canvas元素层不响应鼠标事件。

7.如权利要求1所述的方法，其特征在于，若所述鼠标坐标在所述Canvas元素层的子元素的范围内，将所述子元素的CSS属性中的pointer-events设置成auto，使所述子元素响应鼠标事件。

8.一种计算机可读存储介质，其上存储有可执行指令，所述指令在由处理器执行时，实现如权利要求1-7中任一项所述的方法的步骤。

9.一种电子设备，包括：

存储器，用于存储可执行指令；以及

处理器，用于执行所述存储器中存储的可执行指令，以实现如权利要求1-7中任一项所述的方法的步骤。

10.一种计算装置，包括：

输入设备，用于向所述计算装置输入信息或指令；

输出设备，用于从所述计算装置输出信息；以及

如权利要求9所述的电子设备。