一种防止重复点击页面元素的方法和装置与流程

1.本技术涉及计算机技术领域，更为具体来说，本技术涉及一种防止重复点击页面元素的方法和装置。


背景技术：

2.目前在浏览器页面上，用户发送操作请求的点击对象大多来自按钮，当为有效点击时，将按钮设为禁用状态，当接收到服务器的处理结果时将按钮设为可用状态。对于表单类型的按钮，使用超文本标记语言元素的原生属性来实现，对于非表单类型的按钮，通过添加类似于计数器的装置来实现。
3.然而，当浏览器页面上触发操作的对象如果不是按钮或者触发对象并没有可设置是否为禁用状态的方法比如图片、列表等时，若用户重复点击，就会重复发送相同的操作请求。


技术实现要素：

4.基于上述技术问题，本发明旨在监听当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，据此来判断第一点击事件是否为重复点击操作。
5.本发明第一方面提供了一种防止重复点击页面元素的方法，所述方法包括：
6.监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
7.如果是，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
8.如果否，则响应所述第一点击事件对应的操作请求。
9.在本技术的一些实施例中，响应所述第一点击事件对应的操作请求之前，包括：
10.创建所述目标页面元素的自定义属性；
11.生成所述第一点击事件对应的唯一标识符，并将所述第一点击事件的唯一标识符赋值给创建的所述自定义属性；
12.将所述第一点击事件的唯一标识符存储于所述预设全局变量中。
13.在本技术的一些实施例中，生成所述第一点击事件对应的唯一标识符，包括：
14.获取所述第一点击事件的时间戳；
15.生成一个随机数；
16.基于预设格式，利用所述第一点击事件的时间戳加上所述随机数，生成所述第一点击事件对应的唯一标识符。
17.在本技术的一些实施例中，响应所述第一点击事件对应的操作请求之后，还包括：
18.删除所述预设全局变量中所述目标页面元素对应的自定义属性的属性值。
19.在本技术的一些实施例中，监听到当前页面中目标页面元素对应的第一点击事件之前，还包括：
20.生成所述当前页面所属客户端对应的预设全局变量，其中，所述客户端中的每个页面均能调用所述预设全局变量。
21.在本技术的一些实施例中，优选地，所述目标页面元素包括按钮、图片、列表中的至少之一。
22.本发明第二方面提供了一种防止重复点击页面元素的装置，所述装置包括：
23.监听与查询模块，用于监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
24.重复点击确认模块，用于在预设全局变量中存在所述目标页面元素对应的自定义属性的属性值时，确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
25.响应模块，用于在预设全局变量中不存在所述目标页面元素对应的自定义属性的属性值时，响应所述第一点击事件对应的操作请求。
26.本发明第三方面提供了一种计算机设备，存储有计算机可读指令的存储介质，所述计算机可读指令被一个或多个处理器执行时，使得一个或多个处理器执行以下步骤：
27.监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
28.如果是，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
29.如果否，则响应所述第一点击事件对应的操作请求。
30.本发明第四方面提供了一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时实现以下步骤：
31.监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
32.如果是，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
33.如果否，则响应所述第一点击事件对应的操作请求。
34.本发明第五方面提供了一种计算机程序产品，包括计算机程序，该计算机程序被处理器执行时实现以下步骤：
35.监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
36.如果是，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
37.如果否，则响应所述第一点击事件对应的操作请求。
38.本技术的有益效果为：本技术通过监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，来判断用户是否有重复点击页面元素的操作，不仅有效遏止了用户的重复点击操作，还解决了用户设备在弱网状态下的重复请求操作问题，真正做到了事件操作触发的唯一性。另一方面，本技术也对点击的“防抖”和“节流”操作进行了优化，每次不再需要创建定时器来判断用户的重复点击操作，进而极大地节省了web应用操作时的设备运行内存空间。
附图说明
39.构成说明书的一部分的附图描述了本技术的实施例，并且连同描述一起用于解释本技术的原理。
40.参照附图，根据下面的详细描述，可以更加清楚地理解本技术，其中：
41.图1示出了本技术示例性实施例中一防止重复点击页面元素的方法之步骤示意图；
42.图2示出了本技术示例性实施例中一防止重复点击页面元素的方法流程图；
43.图3示出了本技术示例性实施例的防止重复点击页面元素的方法装置之结构示意图；
44.图4示出了本技术示例性实施例所提供的一种计算机设备的结构示意图；
45.图5示出了本技术示例性实施例所提供的一种存储介质的示意图。
具体实施方式
46.以下，将参照附图来描述本技术的实施例。但是应该理解的是，这些描述只是示例性的，而并非要限制本技术的范围。此外，在以下说明中，省略了对公知结构和技术的描述，以避免不必要地混淆本技术的概念。对于本领域技术人员来说显而易见的是，本技术可以无需一个或多个这些细节而得以实施。在其他的例子中，为了避免与本技术发生混淆，对于本领域公知的一些技术特征未进行描述。
47.应予以注意的是，这里所使用的术语仅是为了描述具体实施例，而非意图限制根据本技术的示例性实施例。如在这里所使用的，除非上下文另外明确指出，否则单数形式也意图包括复数形式。此外，还应当理解的是，当在本说明书中使用术语“包含”和/或“包括”时，其指明存在所述特征、整体、步骤、操作、元件和/或组件，但不排除存在或附加一个或多个其他特征、整体、步骤、操作、元件、组件和/或它们的组合。
48.现在，将参照附图更详细地描述根据本技术的示例性实施例。然而，这些示例性实施例可以多种不同的形式来实施，并且不应当被解释为只限于这里所阐述的实施例。附图并非是按比例绘制的，其中为了清楚表达的目的，可能放大了某些细节，并且可能省略了某些细节。图中所示出的各种区域、层的形状以及它们之间的相对大小、位置关系仅是示例性的，实际中可能由于制造公差或技术限制而有所偏差，并且本领域技术人员根据实际所需可以另外设计具有不同形状、大小、相对位置的区域/层。
49.下面结合说明书附图1-5给出几个实施例来描述根据本技术的示例性实施方式。需要注意的是，下述应用场景仅是为了便于理解本技术的精神和原理而示出，本技术的实
施方式在此方面不受任何限制。相反，本技术的实施方式可以应用于适用的任何场景。
50.目前，用户发送操作请求所点击的页面元素大多来自按钮，当为有效点击时，将按钮设为禁用状态，当接收到服务器的处理结果时将按钮设为可用状态。对于表单类型的按钮，使用超文本标记语言元素的原生属性来实现，对于非表单类型的按钮，通过添加类似于计数器的装置来实现。然而，当页面元素不是按钮或者触发对象并没有可设置是否为禁用状态的方法比如图片、列表等时，若用户重复点击，就会重复发送相同的操作请求。
51.因此在本技术的一些示例性实施例中，提供了一种防止重复点击页面元素的方法，如图1所示，所述方法包括：
52.s1、监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
53.s2、如果是，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
54.s3、如果否，则响应所述第一点击事件对应的操作请求。
55.这里，唯一标识符(universally unique identifier)简称uuid，是一种软件建构的标准，亦为开放软件基金会组织在分布式计算环境领域的一部分。其目的，是让分布式系统中的所有元素，都能有唯一的辨识信息，而不需要通过中央控制端来做辨识信息的指定。uuid由算法生成的唯一标识，通常表示为32个16进制数字组成的字符串。
56.在本技术的一些实施例中，响应所述第一点击事件对应的操作请求之前，包括：创建所述目标页面元素的自定义属性；生成所述第一点击事件对应的uuid，并将所述第一点击事件的uuid赋值给创建的所述自定义属性；将所述第一点击事件的uuid存储于所述预设全局变量中。例如，通过setattribute(“自定义属性名称(customname)”，“属性值(uuid)”)来为用户所点击的元素创建一个自定义的属性，属性值即为刚才所创建的uuid。
57.在本技术的一些优选的实施例中，所述目标页面元素包括按钮、图片、列表中的至少之一。
58.在本技术的一些实施例中，生成所述第一点击事件对应的uuid，包括：获取所述第一点击事件的时间戳；生成一个随机数；基于预设格式，利用所述第一点击事件的时间戳加上所述随机数，生成所述第一点击事件对应的uuid。其中，预设格式表示uuid生成的最终格式，利用replace(regexp，function(str))方法对格式字符进行修改，利用regexp方法替换定义格式中需要替换的格式字符。
59.在本技术的一些实施例中，响应所述第一点击事件对应的操作请求之后，还包括：删除所述预设全局变量中所述目标页面元素对应的自定义属性的属性值。在一种优选的实施方式中，当用户的操作或请求完成时，根据当前元素已创建好的自定义属性值(uuid)，利用findindex方法进行查找，会返回所需要查找的元素在该数组中的索引位置，找不到返回-1，查找到该uuid在预设全局变量中的位置，找到后利用globaldata.splice(索引值，1)将其删除。
60.在本技术的一些实施例中，监听到当前页面中目标页面元素对应的第一点击事件之前，还包括：生成所述当前页面所属客户端对应的预设全局变量，其中，所述客户端中的每个页面均能调用所述预设全局变量。
61.本技术通过监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，来判断用户是否有重复点击页面元素的操作，不仅有效遏止了用户的重复点击操作，还解决了用户设备在弱网状态下的重复请求操作问题，真正做到了事件操作触发的唯一性。另一方面，本技术也对点击的“防抖”和“节流”操作进行了优化，每次不再需要创建定时器来判断用户的重复点击操作，进而极大地节省了web应用操作时的设备运行内存空间。
62.在本技术的一些示例性实施例中，提供了一种防止重复点击页面元素的方法，可参考图2，所述方法具体步骤详述如下。
63.第一步，生成所述当前页面所属客户端对应的预设全局变量，其中，所述客户端中的每个页面均能调用所述预设全局变量。
64.这里在初始化的时候，就生成一个全局变量globaldata(list类型)，要保证在所有的用户展示页都能拿到该变量，这里的list类型表示该全局变量相当于一个数组，在数组里可以存放后续步骤中提到的一个个uuid值。
65.第二步，监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳。其中，所述目标页面元素包括按钮、图片、列表中的至少之一。
66.第三步，如果预设全局变量中存在所述目标页面元素对应的自定义属性的属性值，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应。
67.第四步，如果预设全局变量中不存在所述目标页面元素对应的自定义属性的属性值，则响应所述第一点击事件对应的操作请求。
68.具体执行第四步时，在一种优选的实施方式中，响应所述第一点击事件对应的操作请求之前还包括：创建所述目标页面元素的自定义属性；生成所述第一点击事件对应的uuid，并将所述第一点击事件的uuid赋值给创建的所述自定义属性；将所述第一点击事件的uuid存储于所述预设全局变量中。例如，通过setattribute(“自定义属性名称(customname)”，“属性值(uuid)”)来为用户所点击的元素创建一个自定义的属性，属性值即为刚才所创建的uuid。
69.在一种优选的实施方式中，生成所述第一点击事件对应的uuid，包括：获取所述第一点击事件的时间戳；生成一个随机数；基于预设格式，利用所述第一点击事件的时间戳加上所述随机数，生成所述第一点击事件对应的uuid。其中，预设格式表示uuid生成的最终格式，利用replace(regexp，function(str))方法对格式字符进行修改，利用regexp方法替换定义格式中需要替换的格式字符。
70.第五步，删除所述预设全局变量中所述目标页面元素对应的自定义属性的属性值。
71.在一种优选的实施方式中，当用户的操作或请求完成时，根据当前元素已创建好的自定义属性值(uuid)，利用findindex方法进行查找，会返回所需要查找的元素在该数组中的索引位置，找不到返回-1，查找到该uuid在预设全局变量中的位置，找到后利用globaldata.splice(索引值，1)将其删除。可见，本实施方式不仅有效遏止了用户的重复点击操作，还解决了用户设备在弱网状态下的重复请求操作问题，真正做到了事件操作触发
的唯一性。
72.在本技术的一些示例性实施例中，还提供了一种防止重复点击页面元素的装置，如图3所示，所述装置包括：
73.监听与查询模块，用于监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；
74.重复点击确认模块，用于在预设全局变量中存在所述目标页面元素对应的自定义属性的属性值时，确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；
75.响应模块，用于在预设全局变量中不存在所述目标页面元素对应的自定义属性的属性值时，响应所述第一点击事件对应的操作请求。
76.下面请参考图4，其示出了本技术的一些实施方式所提供的一种计算机设备的示意图。如图4所示，所述计算机设备2包括：处理器200，存储器201，总线202和通信接口203，所述处理器200、通信接口203和存储器201通过总线202连接；所述存储器201中存储有可在所述处理器200上运行的计算机程序，所述处理器200运行所述计算机程序时执行本技术前述任一实施方式所提供的防止重复点击页面元素的方法，所述计算机设备可以是具有触敏显示器的计算机设备。
77.其中，存储器201可能包含高速随机存取存储器(ram：random access memory)，也可能还包括非不稳定的存储器(non-volatile memory)，例如至少一个磁盘存储器。通过至少一个通信接口203(可以是有线或者无线)实现该系统网元与至少一个其他网元之间的通信连接，可以使用互联网、广域网、本地网、城域网等。
78.总线202可以是isa总线、pci总线或eisa总线等。所述总线可以分为地址总线、数据总线、控制总线等。其中，存储器201用于存储程序，所述处理器200在接收到执行指令后，执行所述程序，前述本技术实施例任一实施方式揭示的所述防止重复点击页面元素的方法可以应用于处理器200中，或者由处理器200实现。
79.处理器200可能是一种集成电路芯片，具有信号的处理能力。在实现过程中，上述方法的各步骤可以通过处理器200中的硬件的集成逻辑电路或者软件形式的指令完成。上述的处理器200可以是通用处理器，包括中央处理器(central processing unit，简称cpu)、网络处理器(network processor，简称np)等；还可以是数字信号处理器(dsp)、专用集成电路(asic)、现成可编程门阵列(fpga)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。可以实现或者执行本技术实施例中的公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。结合本技术实施例所公开的方法的步骤可以直接体现为硬件译码处理器执行完成，或者用译码处理器中的硬件及软件模块组合执行完成。软件模块可以位于随机存储器，闪存、只读存储器，可编程只读存储器或者电可擦写可编程存储器、寄存器等本领域成熟的存储介质中。该存储介质位于存储器201，处理器200读取存储器201中的信息，结合其硬件完成上述方法的步骤。
80.本技术实施例提供的计算机设备与本技术实施例提供的防止重复点击页面元素
的方法出于相同的发明构思，具有与其采用、运行或实现的方法相同的有益效果。
81.本技术实施方式还提供一种与前述实施方式所提供的防止重复点击页面元素的方法对应的计算机可读存储介质，请参考图5，图5示出的计算机可读存储介质为光盘30，其上存储有计算机程序(即程序产品)，所述计算机程序在被处理器运行时，会执行前述任意实施方式所提供的防止重复点击页面元素的方法。
82.另外，所述计算机可读存储介质的例子还可以包括，但不限于相变内存(pram)、静态随机存取存储器(sram)、动态随机存取存储器(dram)、其他类型的随机存取存储器(ram)、只读存储器(rom)、电可擦除可编程只读存储器(eeprom)、快闪记忆体或其他光学、磁性存储介质，在此不再一一赘述。
83.本技术的上述实施例提供的计算机可读存储介质与本技术实施例提供的空分复用光网络中量子密钥分发信道分配方法出于相同的发明构思，具有与其存储的应用程序所采用、运行或实现的方法相同的有益效果。
84.本技术实施方式还提供一种计算机程序产品，包括计算机程序，该计算机程序被处理器执行时实现前述任意实施方式所提供的防止重复点击页面元素的方法的步骤，所述方法的步骤包括：监听到当前页面中目标页面元素对应的第一点击事件，查询预设全局变量中是否存在所述目标页面元素对应的自定义属性的属性值，所述属性值为第二点击事件对应的唯一标识符，所述第二点击事件的时间戳早于所述第一点击事件的时间戳；如果是，则确定所述第一点击事件为重复点击事件，不对所述第一点击事件进行响应；如果否，则响应所述第一点击事件对应的操作请求。
85.需要说明的是：在此提供的算法和显示不与任何特定计算机、虚拟装置或者其它设备有固有相关。各种通用装置也可以与基于在此的示教一起使用。根据上面的描述，构造这类装置所要求的结构是显而易见的。此外，本技术也不针对任何特定编程语言。应当明白，可以利用各种编程语言实现在此描述的本技术的内容，并且上面对特定语言所做的描述是为了披露本技术的最佳实施方式。在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本技术的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。
86.类似地，应当理解，为了精简本技术并帮助理解各个发明方面中的一个或多个，在上面对本技术的示例性实施例的描述中，本技术的各个特征有时被一起分组到单个实施例、图或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本技术要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本技术的单独实施例。
87.本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书中公开的每个特征可以由提供相同、等同或相似目
的的替代特征来代替。
88.本技术的各个部件实施例可以以硬件实现，或者以在一个或者多个处理器上运行的软件模块实现，或者以它们的组合实现。本领域的技术人员应当理解，可以在实践中使用微处理器或者数字信号处理器(dsp)来实现根据本技术实施例的虚拟机的创建装置中的一些或者全部部件的一些或者全部功能。本技术还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序。实现本技术的程序可以存储在计算机可读介质上，或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到，或者在载体信号上提供，或者以任何其他形式提供。
89.以上所述，仅为本技术较佳的具体实施方式，但本技术的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本技术揭露的技术范围内，可轻易想到的变化或替换，都应涵盖在本技术的保护范围之内。因此，本技术的保护范围应以所述权利要求的保护范围为准。