一种触屏终端点透解决方法、装置、触屏终端及存储介质与流程

本申请涉及计算机技术领域，特别是涉及一种触屏终端点透解决方法、装置、触屏终端及存储介质。

背景技术：

在台式电脑或笔记本电脑中，在当前页面弹出弹框时，为了避免误点击到当前页面上的标签，在弹框弹出的过程中，增加一层遮罩层，该遮罩层的层级高于当前页面层级且低于弹框层级，同时为了保证用户能够操纵浏览页面，在用户点击遮罩层后，自动隐藏遮罩层。

但是上述方法在应用于触屏终端时，会出现点透的问题，即用户针对遮罩层进行了一次触屏操作，确触发了遮罩层下页面的标签，导致误触发页面跳转，用户体验差。

技术实现要素：

本申请实施例的目的在于提供一种触屏终端点透解决方法、装置、触屏终端及存储介质，以实现减少点透情况的发生，提高用户体验。具体技术方案如下：

第一方面，本申请实施例提供了一种触屏终端点透解决方法，所述方法包括：

在弹出弹框的同时，生成覆盖下层页面的遮罩层；

获取针对所述遮罩层的接触开始touchstart事件；

当获取到针对所述遮罩层的接触结束touchend事件时，阻止触发点击click事件。

可选的，本申请实施例的触屏终端点透解决方法还包括：

在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值，且从获取到针对所述遮罩层的touchstart事件的时刻开始，在预设触发时间内，获取到了针对所述遮罩层的touchend事件，触发针对所述遮罩层的轻敲tap事件。

可选的，本申请实施例的触屏终端点透解决方法还包括，

预先在遮罩层分隔division中添加touchend事件；

所述当获取到针对所述遮罩层的接触结束touchend事件时，阻止触发点击click事件，包括：

在针对所述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用所述javascript回调函数阻止触发click事件。

第二方面，本申请实施例提供了一种触屏终端点透解决方法，所述方法包括：

在弹出弹框的同时，生成覆盖下层页面的遮罩层；

获取针对所述遮罩层的接触开始touchstart事件；

当获取到针对所述遮罩层的接触结束touchend事件时，阻止针对所述遮罩层触发轻敲tap事件。

可选的，在所述当获取到针对所述遮罩层的接触结束touchend事件时，阻止针对所述遮罩层触发轻敲tap事件之后，所述方法还包括：

在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值的情况下，当获取到针对所述遮罩层的接触结束touchend事件时，在预设延时后触发针对所述遮罩层的点击click事件。

可选的，本申请实施例的触屏终端点透解决方法还包括，

预先在遮罩层分隔division中添加touchend事件；

所述当获取到针对所述遮罩层的接触结束touchend事件时，阻止针对所述遮罩层触发轻敲tap事件，包括：

在针对所述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用所述javascript回调函数阻止触发tap事件。

第三方面，本申请实施例提供了一种触屏终端点透解决装置，所述装置包括：

第一遮罩层生成模块，被设置为在弹出弹框的同时，生成覆盖下层页面的遮罩层；

第一事件获取模块，被设置为获取针对所述遮罩层的接触开始touchstart事件；

点击事件阻止模块，被设置为当获取到针对所述遮罩层的接触结束touchend事件时，阻止触发点击click事件。

可选的，本申请实施例的触屏终端点透解决装置还包括：

轻敲事件触发模块，被设置为在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值，且从获取到针对所述遮罩层的touchstart事件的时刻开始，在预设触发时间内，获取到了针对所述遮罩层的touchend事件，触发针对所述遮罩层的轻敲tap事件。

可选的，本申请实施例的触屏终端点透解决装置还包括，

第一事件绑定模块，被设置为预先在遮罩层分隔division中添加touchend事件；

所述点击事件阻止模块，被设置为：

在针对所述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用所述javascript回调函数阻止触发click事件。

第四方面，本申请实施例提供了一种触屏终端点透解决装置，所述装置包括：

第二遮罩层生成模块，被设置为在弹出弹框的同时，生成覆盖下层页面的遮罩层；

第二事件获取模块，被设置为获取针对所述遮罩层的接触开始touchstart事件；

轻敲事件阻止模块，被设置为当获取到针对所述遮罩层的接触结束touchend事件时，阻止针对所述遮罩层触发轻敲tap事件。

可选的，本申请实施例的触屏终端点透解决装置还包括：

点击事件触发模块，被设置为在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值的情况下，当获取到针对所述遮罩层的接触结束touchend事件时，在预设延时后触发针对所述遮罩层的点击click事件。

可选的，本申请实施例的触屏终端点透解决装置还包括，

第二事件绑定模块，被设置为预先在遮罩层分隔division中添加touchend事件；

所述轻敲事件阻止模块，被设置为：

在针对所述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用所述javascript回调函数阻止触发tap事件。

第五方面，本申请实施例提供了一种触屏终端，包括处理器、通信接口、存储器和通信总线，其中，所述处理器，所述通信接口，所述存储器通过通信总线完成相互间的通信；

所述存储器，用于存放计算机程序；

所述处理器，用于执行所述存储器上所存放的程序时，实现上述第一方面或上述第二方面任一所述的触屏终端点透解决方法。

第六方面，本申请实施例提供了一种计算机可读存储介质，所述计算机可读存储介质内存储有计算机程序，所述计算机程序被处理器执行时实现上述第一方面或上述第二方面任一所述的触屏终端点透解决方法。

本申请实施例提供的一种触屏终端点透解决方法、装置、触屏终端及存储介质，获取针对遮罩层的接触开始touchstart事件；当获取到针对所述遮罩层的接触结束touchend事件时，阻止触发点击click事件。或获取针对遮罩层的接触开始touchstart事件；当获取到针对所述遮罩层的接触结束touchend事件时，阻止针对所述遮罩层触发轻敲tap事件。由于阻止了tap事件或click事件，防止在执行tap事件后，再次执行click事件，可以减少点透情况的发生，能够提高用户的体验。当然，实施本申请的任一产品或方法并不一定需要同时达到以上所述的所有优点。

附图说明

为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本申请实施例的触屏终端点透解决方法的第一种流程示意图；

图2为本申请实施例的触屏终端点透解决方法的第二种流程示意图；

图3为本申请实施例的触屏终端点透解决方法的第三种流程示意图；

图4为本申请实施例的触屏终端点透解决方法的第四种流程示意图；

图5为本申请实施例的触屏终端点透解决方法的第五种流程示意图；

图6为本申请实施例的触屏终端点透解决方法的第六种流程示意图；

图7为本申请实施例的触屏终端点透解决装置的第一种示意图；

图8为本申请实施例的触屏终端点透解决装置的第二种示意图；

图9为本申请实施例的触屏终端的第一种示意图；

图10为本申请实施例的触屏终端的第二种示意图。

具体实施方式

下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

在台式电脑或笔记本电脑中，在当前页面弹出弹框时，为了避免误点击到当前页面上的标签，在弹框弹出的过程中，增加一层遮罩层，该遮罩层的层级高于当前页面层级且低于弹框层级，同时为了保证用户能够操纵浏览页面，在用户点击遮罩层后，自动隐藏遮罩层。但是上述方法在应用于触屏终端时，会出现点透的问题，即用户针对遮罩层进行了一次触屏操作，确触发了遮罩层下页面的标签，导致误触发页面跳转，用户体验差。

发明人在研究中发现，触屏终端在模拟鼠标点击的过程中，主要包括touchstart(接触开始)事件、touchend(接触结束)事件、touchmove(接触移动)事件、click(点击)事件及tap(轻敲)事件等。下面对各事件的触发原理进行简单说明。

当用户在触摸屏上放置了触点时，触发touchstart事件。当用户在触摸屏上移动触点时触发touchmove事件，其中touchmove事件的目标element(元素)和touchmove事件对应的touchstart事件的目标element相同，即使在touchmove事件触发时，触点已经移出了该目标element。当一个触点被用户从触摸屏上移除时触发touchend事件，即使当触点移出触摸屏的边界时也将可以触发，例如用户将手指划出屏幕边缘时也可以触发。

click事件是通过touchstart事件与touchend事件触发的，当触发touchstart事件后，在未触发touchmove事件或touchmove事件触点的移动距离小于预设距离阈值的情况下，触发了touchend事件，并且在触发touchend事件后的预设延时(一般设置为300毫秒)之内未触发新的touchstart事件，则触发click事件。其中，设置预设延时是为了判断用户是否再次点击了屏幕，从而分辨双击与单击操作。

tap事件是针对click事件的延时而设立的，在某些即时性要求较高的场景中，例如用户在通过触屏终端进行电子竞技的过程中，click事件的延时会造成非常不好的体验，因此设置tap事件。tap事件一般通过touchstart事件与touchend事件触发的，当触发touchstart事件后，在未触发touchmove事件或touchmove事件触点的移动距离小于预设距离阈值的情况下，在从触发touchstart事件的时刻开始，在预设触发时间内(例如200毫秒内)，触发了touchend事件，则触发tap事件。

发明人在研究中发现，在时间触发的过程中，touchstart事件先于touchend事件，touchend事件先于click事件，且click事件触发默认有300毫秒的延迟，因此，在触屏终端中当触发tap事件后，在300毫秒后还会触发click事件，即当tap触发遮罩层隐藏时，click事件尚未触发，等300毫秒之后由于遮罩层已经隐藏，此时再触发click事件，就会点击到下层页面上的标签，从而出现点透的问题。

有鉴于此，本申请实施例提供了一种触屏终端点透解决方法，参见图1，该方法包括：

s101，在弹出弹框的同时，生成覆盖下层页面的遮罩层。

本申请实施例的触屏终端点透解决方法用于解决触屏终端的点透问题，因此可以通过触屏终端实现，该触屏终端可以为智能手机、平板电脑或触屏电视等包含触摸屏的智能设备。

在用户通过触屏终端浏览app(application，应用程序)指定页面的过程中，触发了弹框操作，在弹出弹框的同时，生成覆盖下层页面(即上述指定页面)的遮罩层，该遮罩层的层级高于下层页面层级且低于弹框的层级。

s102，获取针对遮罩层的接触开始touchstart事件。

当用户在触摸屏上放置了触点时，例如，用户用手指点击遮罩层的过程中，当用户手指触摸到遮罩层区域时，触发touchstart事件，触屏终端获取针对遮罩层的touchstart事件。

s103，当获取到针对上述遮罩层的接触结束touchend事件时，阻止触发点击click事件。

当触点被用户从触摸屏上移除时，例如，用户的手指离开触摸屏时，触发touchend事件，在移动终端获取到针对上述遮罩层的接触结束touchend事件时，调用阻断程序，阻止touchend事件触发click事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击click事件，避免遮罩层已经隐藏后触发click事件导致的点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，参见图2，本申请实施例的触屏终端点透解决方法还包括：

s104，在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值，且从获取到针对遮罩层的touchstart事件的时刻开始，在预设触发时间内，获取到了针对上述遮罩层的touchend事件，触发针对上述遮罩层的tap事件。

预设距离阈值可以按照实际情况进行设定，例如设置为2个最小识别单位、3个最小识别单位或4个最小识别单位等，预设触发时间可以按照实际情况进行设定，例如设置为150毫秒、200毫秒或250毫秒等。

在本申请实施例中，在满足指定条件时，通过touchend事件触发tap事件，通过tap事件隐藏遮蔽层，在有效减少点透的情况下，保证了触屏终端的正常操作。

可选的，参见图3，本申请实施例的触屏终端点透解决方法还包括，

s100，预先在遮罩层division中添加touchend事件。

division(分隔)是层叠样式表中的定位技术，即为分隔，有时可以称其为图层。

上述s103，当获取到针对上述遮罩层的接触结束touchend事件时，阻止触发点击click事件，包括：

在针对上述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用上述javascript回调函数阻止触发click事件。

在本申请实施例中，给出了阻止触发click事件的具体方法，利用javascript回调函数方便简单，可以减少点透情况，提高用户体验。

本申请实施例还提供了一种触屏终端点透解决方法，参见图4，该方法包括：

s201，在弹出弹框的同时，生成覆盖下层页面的遮罩层。

本申请实施例的触屏终端点透解决方法用于解决触屏终端的点透问题，因此可以通过触屏终端实现，该触屏终端可以为智能手机、平板电脑或触屏电视等包含触摸屏的智能设备。

在用户通过触屏终端浏览app(application，应用程序)指定页面的过程中，触发了弹框操作，在弹出弹框的同时，生成覆盖下层页面(即上述指定页面)的遮罩层，该遮罩层的层级高于下层页面层级且低于弹框的层级。

s202，获取针对遮罩层的接触开始touchstart事件。

当用户在触摸屏上放置了触点时，例如，用户用手指点击遮罩层的过程中，当用户手指触摸到遮罩层区域时，触发touchstart事件，触屏终端获取针对遮罩层的touchstart事件。

s203，当获取到针对上述遮罩层的接触结束touchend事件时，阻止针对上述遮罩层触发轻敲tap事件。

当触点被用户从触摸屏上移除时，例如，用户的手指离开触摸屏时，触发touchend事件，在移动终端获取到针对上述遮罩层的接触结束touchend事件时，调用阻断程序，阻止touchend事件触发tap事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击tap事件，避免tap事件触发遮罩层隐藏，后续触发click事件不会点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，参见图5，在上述当获取到针对上述遮罩层的接触结束touchend事件时，阻止针对上述遮罩层触发轻敲tap事件之后，上述方法还包括：

s204，在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值的情况下，当获取到针对上述遮罩层的接触结束touchend事件时，在预设延时后触发针对上述遮罩层的click事件。

预设距离阈值可以按照实际情况进行设定，例如设置为2个最小识别单位、3个最小识别单位或4个最小识别单位等，预设延时可以按照实际情况进行设定，一般设定为300毫秒。触屏终端触发针对遮罩层的click事件，在触发针对遮罩层的click事件后隐藏上述遮蔽层。

在本申请实施例中，在满足指定条件时，通过touchend事件触发click事件，通过click事件隐藏遮蔽层，在有效减少点透的情况下，保证了触屏终端的正常操作。

可选的，参见图6，本申请实施例的触屏终端点透解决方法还包括，

s200，预先在遮罩层分隔division中添加touchend事件；

上述s203，当获取到针对上述遮罩层的接触结束touchend事件时，阻止针对上述遮罩层触发轻敲tap事件，包括：

在针对上述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用上述javascript回调函数阻止触发tap事件。

在本申请实施例中，给出了阻止触发tap事件的具体方法，利用javascript回调函数方便简单，可以减少点透情况，提高用户体验。

本申请实施例提供了一种触屏终端点透解决装置，参见图7，该装置包括：

第一遮罩层生成模块701，被设置为在弹出弹框的同时，生成覆盖下层页面的遮罩层；

第一事件获取模块702，被设置为获取针对上述遮罩层的接触开始touchstart事件；

点击事件阻止模块703，被设置为当获取到针对上述遮罩层的接触结束touchend事件时，阻止触发点击click事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击click事件，避免遮罩层已经隐藏后触发click事件导致的点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，本申请实施例的触屏终端点透解决装置还包括：

轻敲事件触发模块，被设置为在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值，且从获取到针对上述遮罩层的touchstart事件的时刻开始，在预设触发时间内，获取到了针对上述遮罩层的touchend事件，触发针对上述遮罩层的轻敲tap事件。

可选的，本申请实施例的触屏终端点透解决装置还包括，

第一事件绑定模块，被设置为预先在遮罩层分隔division中添加touchend事件；

上述点击事件阻止模块703，被设置为：

在针对上述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用上述javascript回调函数阻止触发click事件。

本申请实施例还提供了一种触屏终端点透解决装置，参见图8，该装置包括：

第二遮罩层生成模块801，被设置为在弹出弹框的同时，生成覆盖下层页面的遮罩层；

第二事件获取模块802，被设置为获取针对上述遮罩层的接触开始touchstart事件；

轻敲事件阻止模块803，被设置为当获取到针对上述遮罩层的接触结束touchend事件时，阻止针对上述遮罩层触发轻敲tap事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击tap事件，避免tap事件触发遮罩层隐藏，后续触发click事件不会点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，本申请实施例的触屏终端点透解决装置还包括：

点击事件触发模块，被设置为在未触发touchmove事件或touchmove事件中触点的移动距离小于预设距离阈值的情况下，当获取到针对上述遮罩层的接触结束touchend事件时，在预设延时后触发针对上述遮罩层的点击click事件。

可选的，本申请实施例的触屏终端点透解决装置还包括，

第二事件绑定模块，被设置为预先在遮罩层分隔division中添加touchend事件；

上述轻敲事件阻止模块803，被设置为：

在针对上述遮罩层触发touchend事件时，触发基于对象和时间驱动的客户端脚本语言javascript回调函数，利用上述javascript回调函数阻止触发tap事件。

本申请实施例还提供了一种触屏终端，如图9所示，包括处理器901、通信接口902、存储器903和通信总线904，其中，处理器901，通信接口902，存储器903通过通信总线904完成相互间的通信，

存储器903，用于存放计算机程序；

处理器901，用于执行存储器903上所存放的程序时，实现如下步骤：

在弹出弹框的同时，生成覆盖下层页面的遮罩层；

获取针对上述遮罩层的接触开始touchstart事件；

当获取到针对上述遮罩层的接触结束touchend事件时，阻止触发点击click事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击click事件，避免遮罩层已经隐藏后触发click事件导致的点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，处理器901，用于执行存储器903上所存放的程序时，还能够实现上述任一触屏终端点透解决方法。

本申请实施例还提供了一种触屏终端，如图10所示，包括处理器1001、通信接口1002、存储器1003和通信总线1004，其中，处理器1001，通信接口1002，存储器1003通过通信总线1004完成相互间的通信，

存储器1003，用于存放计算机程序；

处理器1001，用于执行存储器1003上所存放的程序时，实现如下步骤：

在弹出弹框的同时，生成覆盖下层页面的遮罩层；

获取针对上述遮罩层的接触开始touchstart事件；

当获取到针对上述遮罩层的接触结束touchend事件时，阻止针对上述遮罩层触发轻敲tap事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击tap事件，避免tap事件触发遮罩层隐藏，后续触发click事件不会点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，处理器1001，用于执行存储器1003上所存放的程序时，还能够实现上述任一触屏终端点透解决方法。

上述触屏终端提到的通信总线可以是外设部件互连标准(peripheralcomponentinterconnect，pci)总线或扩展工业标准结构(extendedindustrystandardarchitecture，eisa)总线等。该通信总线可以分为地址总线、数据总线、控制总线等。为便于表示，图中仅用一条粗线表示，但并不表示仅有一根总线或一种类型的总线。

通信接口用于上述触屏终端与其他设备之间的通信。

存储器可以包括随机存取存储器(randomaccessmemory，ram)，也可以包括非易失性存储器(non-volatilememory，nvm)，例如至少一个磁盘存储器。可选的，存储器还可以是至少一个位于远离前述处理器的存储装置。

上述的处理器可以是通用处理器，包括中央处理器(centralprocessingunit，cpu)、网络处理器(networkprocessor，np)等；还可以是数字信号处理器(digitalsignalprocessing，dsp)、专用集成电路(applicationspecificintegratedcircuit，asic)、现场可编程门阵列(field-programmablegatearray，fpga)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。

本申请实施例提供了一种计算机可读存储介质，上述计算机可读存储介质内存储有计算机程序，上述计算机程序被处理器执行时实现如下步骤：

在弹出弹框的同时，生成覆盖下层页面的遮罩层；

获取针对上述遮罩层的接触开始touchstart事件；

当获取到针对上述遮罩层的接触结束touchend事件时，阻止触发点击click事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击click事件，避免遮罩层已经隐藏后触发click事件导致的点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，上述计算机程序被处理器执行时，还能够实现上述任一触屏终端点透解决方法。

本申请实施例提供了一种计算机可读存储介质，上述计算机可读存储介质内存储有计算机程序，上述计算机程序被处理器执行时实现如下步骤：

在弹出弹框的同时，生成覆盖下层页面的遮罩层；

获取针对上述遮罩层的接触开始touchstart事件；

当获取到针对上述遮罩层的接触结束touchend事件时，阻止针对上述遮罩层触发轻敲tap事件。

在本申请实施例中，在当获取到针对上述遮罩层的touchend事件时，阻止触发点击tap事件，避免tap事件触发遮罩层隐藏，后续触发click事件不会点击到下层页面上的标签，从而减少点透情况，提高用户体验。

可选的，上述计算机程序被处理器执行时，还能够实现上述任一触屏终端点透解决方法。

需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

本说明书中的各个实施例均采用相关的方式描述，各个实施例之间相同相似的部分互相参见即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于装置、触屏终端及存储介质的实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

以上所述仅为本申请的较佳实施例而已，并非用于限定本申请的保护范围。凡在本申请的精神和原则之内所作的任何修改、等同替换、改进等，均包含在本申请的保护范围内。