页面交互方法及装置与流程

本发明涉及电子信息领域，具体涉及一种页面交互方法及装置。

背景技术：

目前，很多页面中都会包含交互元素，用以提供与用户之间的交互功能。例如，在生活类应用的页面首页通常会包括一个用于引导用户点击热门优惠活动的活动类交互元素，通过该活动类交互元素能够跳转到热门优惠活动页面。

但是，发明人在实现本发明的过程中，发现上述方式至少存在如下问题：在现有技术中，交互元素通常由形状规则的容器承载，而交互元素的元素图案则可能为各类不规则形状，相应地，交互元素的元素图案无法将容器全部填充，而必然存在部分空白区域。该部分空白区域通常直接显示交互元素所对应的底层元素的内容。由此可见，该部分空白区域在用户看来是属于底层元素的内容，因此，用户往往会直接点击该部分空白区域以操控其底层元素，但实质上，由于该部分空白区域由交互元素所在的容器承载，因而导致用户在意图操控其底层元素时误触发交互元素，由此容易导致交互元素与其底层元素之间发生冲突，从而严重降低了用户体验。

技术实现要素：

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的一种页面交互方法及装置。

根据本发明的一个方面，提供了一种页面交互方法，包括：

当接收到与页面中的预设交互元素相对应的交互指令时，确定与所述交互指令相对应的交互位置；

判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配；

若否，将所述交互指令透传给与所述预设交互元素相对应的底层元素，以供所述底层元素处理所述交互指令。

可选地，所述判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配之后，进一步包括：

若是，由所述预设交互元素处理所述交互指令。

可选地，所述判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配包括：

按照预设的区域划分规则，将所述预设交互元素划分为指令响应区域以及指令透传区域；

根据所述交互位置是否属于所述指令响应区域的区域范围，判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配。

可选地，所述预设的区域划分规则包括：

针对所述预设交互元素对应的元素图片进行灰度处理，根据灰度处理结果确定所述预设交互元素中包含的透明区域以及非透明区域；

将所述非透明区域确定为指令响应区域，将所述透明区域确定为指令透传区域。

可选地，所述根据灰度处理结果确定所述预设交互元素中包含的透明区域以及非透明区域之后，进一步包括：

针对所述预设交互元素中包含的透明区域和/或非透明区域执行膨胀处理和/或腐蚀处理。

可选地，所述预设交互元素为动态交互元素，则所述判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配具体包括：

根据所述动态交互元素的实时状态信息，动态确定所述预设交互元素中包含的指令响应区域，并判断所述交互位置与动态确定的指令响应区域是否匹配。

可选地，所述预设交互元素的元素状态包括：显示状态以及隐藏状态；当检测到页面操作行为时，所述预设交互元素的元素状态为隐藏状态；当在预设时长内未检测到页面操作行为时，所述预设交互元素的元素状态为显示状态。

可选地，所述预设交互元素用于根据用户的用户行为信息、用户位置信息和/或活动配置信息实现个性化信息的推送。

可选地，所述预设交互元素包括：悬浮于页面顶层的悬浮式交互元素，则所述与所述预设交互元素相对应的底层元素包括：位于所述悬浮式交互元素底层的页面内容元素和/或页面控件元素。

根据本发明的另一个方面，提供了一种页面交互装置，包括：

接收模块，适于当接收到与页面中的预设交互元素相对应的交互指令时，确定与所述交互指令相对应的交互位置；

判断模块，适于判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配；

透传模块，适于在判断模块的判断结果为否时，将所述交互指令透传给与所述预设交互元素相对应的底层元素，以供所述底层元素处理所述交互指令。

可选地，所述装置进一步包括：

交互模块，适于在判断模块的判断结果为是时，由所述预设交互元素处理所述交互指令。

可选地，所述判断模块具体适于：

按照预设的区域划分规则，将所述预设交互元素划分为指令响应区域以及指令透传区域；

根据所述交互位置是否属于所述指令响应区域的区域范围，判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配。

可选地，所述预设的区域划分规则包括：

针对所述预设交互元素对应的元素图片进行灰度处理，根据灰度处理结果确定所述预设交互元素中包含的透明区域以及非透明区域；

将所述非透明区域确定为指令响应区域，将所述透明区域确定为指令透传区域。

可选地，所述判断模块进一步适于：

针对所述预设交互元素中包含的透明区域和/或非透明区域执行膨胀处理和/或腐蚀处理。

可选地，所述预设交互元素为动态交互元素，则所述判断模块具体适于：

根据所述动态交互元素的实时状态信息，动态确定所述预设交互元素中包含的指令响应区域，并判断所述交互位置与动态确定的指令响应区域是否匹配。

可选地，所述预设交互元素的元素状态包括：显示状态以及隐藏状态；当检测到页面操作行为时，所述预设交互元素的元素状态为隐藏状态；当在预设时长内未检测到页面操作行为时，所述预设交互元素的元素状态为显示状态。

可选地，所述预设交互元素用于根据用户的用户行为信息、用户位置信息和/或活动配置信息实现个性化信息的推送。

可选地，所述预设交互元素包括：悬浮于页面顶层的悬浮式交互元素，则所述与所述预设交互元素相对应的底层元素包括：位于所述悬浮式交互元素底层的页面内容元素和/或页面控件元素。

依据本发明的再一方面，提供了一种电子设备，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行如上述的页面交互方法对应的操作。

依据本发明的再一方面，提供了一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行如上述的页面交互方法对应的操作。

在本发明提供的页面交互方法及装置中，当接收到与页面中的预设交互元素相对应的交互指令时，确定与该交互指令相对应的交互位置；并判断该交互位置与预设交互元素中包含的指令响应区域是否匹配；若否，将交互指令透传给与交互元素相对应的底层元素，以供底层元素处理该交互指令。由此可见，在本发明提供的方式中，在预设交互元素中划分指令响应区域以及非指令响应区域，只有当交互指令对应的交互位置位于指令响应区域时，交互元素才响应该交互指令；否则，当交互指令对应的交互位置位于非指令响应区域时，交互元素不响应该交互指令，而是由底层元素进行响应，从而降低了用户在意图操控其底层元素时误触发交互元素的概率，避免了交互元素与其底层元素之间的冲突，提升了用户体验。

上述说明仅是本发明技术方案的概述，为了能够更清楚了解本发明的技术手段，而可依照说明书的内容予以实施，并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂，以下特举本发明的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1示出了本发明实施例一提供的一种页面交互方法的流程图；

图2示出了本发明实施例二提供的一种页面交互方法的流程图；

图3示出了本发明实施例三提供的一种页面交互装置的结构图；

图4示出了本发明实施例五提供的一种电子设备的结构示意图；

图5示出了页面布局中的各个元素的示意图；

图6示出了本实施例中包含悬浮块的页面的布局示意图；

图7a示出了执行灰度处理后的示意图；

图7b示出了执行膨胀处理后的示意图。

具体实施方式

下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。

实施例一

图1示出了本发明实施例一提供的一种页面交互方法的流程图。如图1所示，该方法包括：

步骤s110：当接收到与页面中的预设交互元素相对应的交互指令时，确定与该交互指令相对应的交互位置。

其中，页面中的预设交互元素可以为各种类型的交互元素，例如，包括：悬浮入口、按钮等。与页面中的预设交互元素相对应的交互指令是指：通过触摸预设交互元素所在区域而触发的交互指令。相应的，每当接收到通过触摸预设交互元素所在区域而触发的交互指令时，进一步确定与该交互指令相对应的交互位置，该交互位置用于描述本次交互指令所对应的触摸位置与预设交互元素之间的位置关系。例如，与该交互指令相对应的交互位置可能位于预设交互元素的中部区域、下部区域或上部区域等，还可能位于预设交互元素的左侧区域或右侧区域等。

步骤s120：判断该交互位置与预设交互元素中包含的指令响应区域是否匹配。

具体地，在本实施例中，需要将预设交互元素至少划分为指令响应区域以及非指令响应区域两部分。具体的划分方式可以根据预设交互元素中包含的图案区域进行划分，例如，将预设交互元素中含有图案的非透明区域设置为指令响应区域，将预设交互元素中不含有图案的透明区域设置为非指令响应区域。又如，将预设交互元素按照上下、左右、里外等相对位置关系划分为指令响应区域以及非指令响应区域，比如，将预设交互元素的中心区域设置为指令响应区域，将预设交互元素的外围区域(即非中心区域)设置为非指令响应区域。总之，本发明不限定指令响应区域的具体划分方式，本领域技术人员可根据实际需求灵活设置。

步骤s130：若否，将交互指令透传给与预设交互元素相对应的底层元素，以供所述底层元素处理所述交互指令。

具体地，若交互位置与预设交互元素中包含的指令响应区域不匹配，则说明该交互位置处于预设交互元素中的非指令响应区域。相应地，预设交互元素将该交互指令透传给与预设交互元素相对应的底层元素，以便由底层元素处理该交互指令。其中，与预设交互元素相对应的底层元素是指：位于预设交互元素的下一层的元素，例如，当预设交互元素位于顶层(即处于第一层级)时，与预设交互元素相对应的底层元素是指位于预设交互元素下方且处于第二层级的元素。另外，底层元素处理该交互指令时，可按照各种预设规则进行处理，本发明不限定具体的处理方式。例如，底层元素需要判断该交互指令的交互位置是否对应于底层元素中的可交互区域(例如按键、控件、超链接等区域)，若是，则响应该交互指令以实现与用户间的交互；若否，则不响应该交互指令。

由此可见，在本发明提供的方式中，在预设交互元素中划分指令响应区域以及非指令响应区域，只有当交互指令对应的交互位置位于指令响应区域时，交互元素才响应该交互指令；否则，当交互指令对应的交互位置位于非指令响应区域时，交互元素不响应该交互指令，而是由底层元素进行响应，从而降低了用户在意图操控其底层元素时误触发交互元素的概率，避免了交互元素与其底层元素之间的冲突，提升了用户体验。

图2示出了本发明实施例二提供的一种页面交互方法的流程图。如图2所示，该方法包括：

步骤s210：当接收到与页面中的预设交互元素相对应的交互指令时，确定与该交互指令相对应的交互位置。

在本实施例中，页面中的预设交互元素主要是指悬浮于页面顶层的悬浮式交互元素，用于实现对用户进行引导或推送的功能。例如，该预设交互元素为活动悬浮入口(也称为悬浮块)，诸如营销类活动的引导入口等。通过该悬浮入口，能够向用户推送热点活动。

发明人在实现本发明的过程中发现：传统方式中的悬浮入口固定出现在页面底部，无论用户进行何种操作，该悬浮入口始终保留在页面底部的固定区域。该方式至少存在如下缺陷：一方面，当用户点击页面中的其他内容时，位于底部的悬浮入口可能会对用户当前浏览内容造成遮挡，从而为用户的正常浏览造成干扰；另一方面，该悬浮入口始终出现在固定位置，容易导致用户审美疲劳，进而忽略该悬浮入口的存在，不利于与用户实现互动。

为了解决上述问题，在本发明中，该预设交互元素至少具有两种元素状态，分别为显示状态以及隐藏状态。其中，当检测到页面操作行为时，该预设交互元素的元素状态为隐藏状态，以免对用户的正常浏览行为造成干扰；当在预设时长内未检测到页面操作行为时，该预设交互元素的元素状态为显示状态，以使用户注意到新增的交互元素。例如，在本实施例中，在应用首页中显示入场活动所对应的悬浮入口，当检测到用户的页面操作行为时(例如当检测到用户向上滑动时)，该悬浮入口的元素状态从显示状态切换为隐藏状态，从而隐藏为用户不可见状态，以避免对用户的页面操作行为造成干扰。接下来，当在预设时长内未检测到页面操作行为时(例如当用户连续5秒未进行任何操作时)，该悬浮入口的元素状态从隐藏状态切换为显示状态。与持续显示的方式相比，该方式能够根据用户的操作行为使悬浮入口时隐时现，从而提升了与用户的交互效果，有利于在合适的场景中引起用户注意力、诱发用户情绪反应，以提高点击悬浮入口的概率。可选地，为了进一步提升用户体验，在本实施例中，当该悬浮入口的元素状态从隐藏状态切换为显示状态时，该悬浮入口进一步切换为品牌形象，并冒出气泡对话框以便为用户推送信息，从而提升信息推送的趣味性。

具体地，当该预设交互元素为显示状态时，用户能够针对该预设交互元素触发交互指令，以便实现与该预设交互元素相对应的交互操作。在本实施例中，当接收到与页面中的预设交互元素相对应的交互指令时，进一步确定与该交互指令相对应的交互位置。该交互位置用于描述该交互指令的触发位置在预设交互元素中的具体区域或坐标值。

为了便于理解本发明，下面先对页面的布局方式进行简单介绍：

图5示出了页面布局中的各个元素的示意图。如图5所示，在页面布局时，将页面中的文字或图片等内容通过不同的页面元素承载。例如，图5中的每个方框对应于一个页面元素，页面元素中的内容可以是图片，也可以是文本。通常情况下，每个页面元素以矩形为基本形状，不规则形状的内容也是通过矩形进行包裹的。例如，图5中的“别的靠谱”四个字是通过一个矩形框状的页面元素承载的，该矩形框状的页面元素中只有左侧具有“别的靠谱”的内容，而右侧则为空白区域。针对该页面元素，虽然用户仅能看到左侧的“别的靠谱”的内容，但是，当用户点击该元素右侧的空白区域时，由于该空白区域仍然属于该页面元素所在的区域，因此，仍为能够响应点击操作的热点区域，从而导致用户容易发生误操作。图6示出了本实施例中包含悬浮块的页面的布局示意图。由于页面中的页面元素可能分别对应于不同的层级，而页面响应顺序则是从页面的最上层(即层级最高、离用户最近的元素)开始响应。因此，在本实施例中，将悬浮块布局在最上层，即：设置悬浮块的页面层级最高，处于第一层级，以防止悬浮块被手势或其他按钮拦截响应。

由于本实施例中的悬浮入口式交互元素为多推荐悬浮块，该多推荐悬浮块可以为动态交互元素，即：元素样式动态发生变化，因此，该悬浮块的视觉样式丰富、交互形式多样，相应的，该多推荐悬浮块势必会在一些场景下出现较大且不规则的样式。例如，在图6中，该悬浮块中的图案区域包括上方的文本区域以及下方的图像区域，该图案区域的形状为不规则形状，为了承载该不规则形状，该页面元素所对应的承载容器的面积至少包括图6中的矩形框区域。在该矩形框区域中，仅“您收藏肯德基套餐打5折呦”所在的文本区域以及下方的卡通图像区域为用户可见的非透明区域，该矩形框区域的右下方区域为用户不可见的透明区域。对于用户而言，能够透过该矩形框区域的右下方的透明区域直接观看到位于该悬浮块下方的底层元素。由于该悬浮块处于第一层级，相应的，其下方的底层元素处于第二层级。当然，若该底层元素所在的透明区域中能够透出位于第三层级甚至第四层级的元素，则本实施例中提到的与预设交互元素相对应的底层元素除包含第二层级的元素外，还可以包含第三层级甚至第四层级的元素。总之，本发明不限定预设交互元素及其底层元素的具体层级，凡是位于预设交互元素底部、且响应顺序低于预设交互元素的元素均可作为该预设交互元素的底层元素。

发明人在实现本发明的过程中发现，由于用户能够透过该矩形框区域的右下方的透明区域直接观看到位于该悬浮块下方的底层元素，因此，用户往往会通过点击该矩形框区域的右下方的透明区域来操控位于该悬浮块下方的底层元素，此时，由于该矩形框区域的右下方的透明区域仍然属于预设交互元素，从而导致用户误触发预设交互元素。为了避免元素交互元素与其底层元素之间的冲突问题，本发明需要在预设交互元素接收到到交互指令时，动态地确定与该交互指令相对应的交互位置。该交互位置可通过坐标值表示。例如，假设以预设交互元素的中心区域为坐标原点建立坐标系，则可以将预设交互元素中的每个像素点均通过一组坐标值进行表示，从而当该预设交互元素接收到到交互指令时，可以通过该交互指令所在的交互位置的坐标值描述本次交互指令的具体位置。例如，可能为图6中的“您收藏肯德基套餐打5折呦”所在的文本区域、还可能为下方的卡通图像区域、也可能为右下方的透明区域。总之，通过确定与该交互指令相对应的交互位置，能够确定该交互指令的具体触控点。

步骤s220：按照预设的区域划分规则，将该预设交互元素划分为指令响应区域以及指令透传区域。

其中，该指令透传区域也可以理解为非指令响应区域，即：将除指令响应区域之外的其余区域作为指令透传区域。

在本步骤的第一种实现方式中，为了提升实时响应速度，预先将该预设交互元素划分为指令响应区域以及指令透传区域。另外，当该预设交互元素为包含多张连续显示的图片的动图时，预先针对该组动图中的每一张图片划分指令响应区域以及指令透传区域。相应的，在后续接收到交互指令时，动态判断该预设交互元素当前所显示的图片的图片标识，并根据该图片标识获取相应的区域划分结果。该方式具有处理时延低、效率高的优势。

在本步骤的第二种实现方式中，为了能够灵活应对各种形象百变的预设交互元素，需要根据动态的预设交互元素的实时状态信息，动态确定预设交互元素中包含的指令响应区域，以便在后续步骤中进一步判断该交互位置与动态确定的指令响应区域是否匹配。该方式能够实时地确定预设交互元素的当前形状所对应的指令响应区域以及指令透传区域，实时性较高，尤其适用于交互元素动图变幻且形状不定的场景中。在本实施例中，为了提升用户视觉体验，采用第二种实现方式，相应的，本实施例中的预设交互元素的形状不固定，可能随线上业务需求而实时调整。

具体地，上述的区域划分规则用于划分交互元素中用于响应交互指令的区域以及用于透传交互指令的区域，具体划分规则可由本领域技术人员灵活设置，本发明不做限定。在本实施例中，主要从用户视觉角度进行划分，相应的，预设的区域划分规则包括：针对预设交互元素对应的元素图片进行灰度处理，根据灰度处理结果确定预设交互元素中包含的透明区域以及非透明区域；将非透明区域确定为指令响应区域，将透明区域确定为指令透传区域。可选地，为了消除一些较小的区域，在根据灰度处理结果确定预设交互元素中包含的透明区域以及非透明区域之后，进一步包括：针对交互元素中包含的透明区域和/或非透明区域执行膨胀处理和/或腐蚀处理。

例如，图7a示出了执行灰度处理后的示意图，图7b示出了执行膨胀处理后的示意图。在图7a以及图7b所示的示例中，需要针对悬浮块的图片截图执行以下操作：首先，针对悬浮块的图片截图执行灰度处理。通过灰度处理，能够确定其中的非透明区域以及透明区域，并且，灰度处理能够忽略色彩差异，降低运算复杂度，从而在实时运算场景中显著提升计算速度。然后，针对灰度区域(即非透明区域)进行膨胀处理，以使灰度区域的边缘膨胀为白色，从而封闭较小的间隙。例如，在本示例中，封闭了卡通小人的叉子以及手和头之间的距离，从而避免了上述小区域导致的误操作现象。具体处理时，可以针对区域面积小于预设面积的透明区域所对应的边缘执行膨胀处理或腐蚀处理，以消除较小的透明区域。最后，根据图7b中得到的图片确定指令响应区域的区域范围。例如，根据图7b中得到的图片的形状、轮廓以及在预设交互元素中所处的位置，建立一个坐标矩阵，该坐标矩阵用于存储图7b中得到的图片(即灰度处理后的非透明区域)中的各个像素点相对于预设交互元素的中心点的坐标值。通过该坐标矩阵即可快速确定预设交互元素中处于指令响应区域的各个像素点的坐标值。或者，也可以根据图7b中得到的图片构建点击手势的掩码层，该掩码层用于通过二进制数值判断是否响应点击手势。比如，该掩码层存储了预设交互元素中的各个像素点所对应的掩码数值，其中，与图7b中得到的图片对应的像素点的掩码数值为1，其他位置的像素点的掩码数值为0。相应的，当用户点击悬浮块时，若是点击位置映射到该掩码层中数值为1的像素点，则说明点击的是指令响应区域；若是点击位置映射到该掩码层中数值为0的像素点，则说明点击的是指令透传区域。

步骤s230：根据该交互位置是否属于指令响应区域的区域范围，判断该交互位置与预设交互元素中包含的指令响应区域是否匹配。

由于上一步骤中已经划分了指令响应区域以及指令透传区域，因此，本步骤能够直接根据上一步骤的划分结果判断该交互位置是否属于指令响应区域的区域范围。例如，根据该交互位置的坐标值是否属于上文提到的坐标矩阵进行判断，若是，则确定该交互位置与预设交互元素中包含的指令响应区域匹配；若否，则确定该交互位置与预设交互元素中包含的指令响应区域不匹配，而是与指令透传区域匹配。又如，根据该交互位置映射到上文提到的掩码层中数值进行判断，若该交互位置映射到上文提到的掩码层中的数值为1，则确定该交互位置与预设交互元素中包含的指令响应区域匹配；若该交互位置映射到上文提到的掩码层中的数值为0，则确定该交互位置与预设交互元素中包含的指令响应区域不匹配，而是与指令透传区域匹配。

步骤s240：若是，由交互元素处理该交互指令。

具体地，当交互位置与预设交互元素中包含的指令响应区域匹配时，说明该交互指令应该由交互元素进行响应。交互元素的具体处理方式取决于该交互元素本身的类型、功能等，本发明对具体的处理方式不做限定。

在本实施例中，预设交互元素为多推荐悬浮块，用于为用户推送各类实体，包括电子券(如满减券、优惠券等)、商品或活动等，以引导用户进入下一级页面。在本实施例中，为了精准地满足用户的个性化需求，提升点击转化率，将预设交互元素设置为能够根据用户的用户行为信息、用户位置信息和/或活动配置信息实现个性化信息的推送。具体地，在本实施例中，首先根据用户行为信息推送与用户行为相关的个性化信息。例如，服务端查询当前用户是否存在浏览商品以及收藏商品的数据记录，若存在，则通过个性化推荐算法根据用户浏览商品以及收藏商品的数据记录进行推送，从而使客户端展示与已浏览或已收藏商品相关的信息。然后，根据用户位置信息推送与用户位置相关的个性化信息。例如，服务端若未查询到用户行为信息，则获取用户地理位置信息，判断用户当前位置所在的5-10公里范围内是否有参加活动的商家，若是，则基于lbs定位技术精准推荐周边商家，从而使客户端展示5-10公里内参加活动的商家，以便于用户就近消费。最后，根据活动配置信息进行推送。例如，若服务器判断出用户周边不存在活动商家，则根据预设配置的热门活动的活动配置信息向用户推荐热门活动，从而使客户端展示该活动。

步骤s250：若否，将交互指令透传给与预设交互元素相对应的底层元素，以供该底层元素处理该交互指令。

其中，当交互位置与预设交互元素中包含的指令响应区域不匹配时，说明该交互指令应该由交互元素对应的底层元素进行响应。本发明不限定底层元素的具体类型以及响应处理方式。

例如，当预设交互元素为悬浮式交互元素时，位于悬浮式交互元素底层的底层元素可以为页面内容元素和/或页面控件元素。其中，当位于交互元素底层的底层元素为页面内容元素时，该底层元素不对该交互指令进行任何处理；当位于交互元素底层的底层元素为页面控件元素，该底层元素针对该交互指令执行与该控件相对应的处理。总之，该底层元素接收到透传的交互指令后，是否处理该交互指令以及如何处理该交互指令完全取决于底层元素的内部逻辑：当该底层元素为不可交互元素(如静态图片、文字等)时则不处理该交互指令；当该底层元素为可交互元素(如按钮、控件、超链接等)时则处理该交互指令。

另外，本实施例中的各个步骤之间的先后顺序可由本领域技术人员灵活调整，且本领域技术人员能够将上述各个步骤合并为更少的步骤或拆分为更多的步骤，本发明对此不作限定。另外，在交互元素决定是由本元素处理该交互指令还是将该交互指令透传给下一级元素时，可通过预设的配置参数进行配置。例如，预先设置一个配置参数，该配置参数的数值用于描述该交互指令的处理方式。比如，当数值为1时由交互元素处理该交互指令，当数值为0时透传给下一级元素。由此可见，在本发明中，该配置参数的参数值可根据实际情况动态调整，从而避免了冲突问题。

综上可知，通过本发明中的方式，能够通过活动投放中的悬浮入口进行精准投放，并且加入品牌对话气泡，将之前传统的固定活动入口推送，优化为个性化推荐算法精准多条推送。并且，优化了悬浮块的有效点击区域，将不规则形状的透明区域进行处理，以减少遮挡概率。该方式能够动态规划出预设交互元素中需要拦截手势和传递手势的区域，从而避免了与底层元素之间的冲突，且实时性较好，能够广泛适用于各类灵活展现多种样式的交互元素。该方式不影响用户的正常操作，能够在用户点击预设交互元素中的透明区域时，将手势正常传递至未被遮挡的底层元素。

实施例三

图3示出了本发明实施例三提供的一种页面交互装置的结构示意图，该装置包括：

接收模块31，适于当接收到与页面中的预设交互元素相对应的交互指令时，确定与所述交互指令相对应的交互位置；

判断模块32，适于判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配；

透传模块33，适于在判断模块的判断结果为否时，将所述交互指令透传给与所述预设交互元素相对应的底层元素，以供所述底层元素处理所述交互指令。

可选地，所述装置进一步包括：

交互模块，适于在判断模块的判断结果为是时，由所述预设交互元素处理所述交互指令。

可选地，所述判断模块32具体适于：

按照预设的区域划分规则，将所述预设交互元素划分为指令响应区域以及指令透传区域；

根据所述交互位置是否属于所述指令响应区域的区域范围，判断所述交互位置与所述预设交互元素中包含的指令响应区域是否匹配。

可选地，所述预设的区域划分规则包括：

针对所述预设交互元素对应的元素图片进行灰度处理，根据灰度处理结果确定所述预设交互元素中包含的透明区域以及非透明区域；

将所述非透明区域确定为指令响应区域，将所述透明区域确定为指令透传区域。

可选地，所述判断模块32进一步适于：

针对所述预设交互元素中包含的透明区域和/或非透明区域执行膨胀处理和/或腐蚀处理。

可选地，所述预设交互元素为动态交互元素，则所述判断模块32具体适于：

根据所述动态交互元素的实时状态信息，动态确定所述预设交互元素中包含的指令响应区域，并判断所述交互位置与动态确定的指令响应区域是否匹配。

可选地，所述预设交互元素的元素状态包括：显示状态以及隐藏状态；当检测到页面操作行为时，所述预设交互元素的元素状态为隐藏状态；当在预设时长内未检测到页面操作行为时，所述预设交互元素的元素状态为显示状态。

可选地，所述预设交互元素用于根据用户的用户行为信息、用户位置信息和/或活动配置信息实现个性化信息的推送。

可选地，所述预设交互元素包括：悬浮于页面顶层的悬浮式交互元素，则所述与所述预设交互元素相对应的底层元素包括：位于所述悬浮式交互元素底层的页面内容元素和/或页面控件元素。

关于上述各个模块的具体结构和工作原理可参照方法实施例中相应部分的描述，此处不再赘述。

实施例四

本申请实施例四提供了一种非易失性计算机存储介质，所述计算机存储介质存储有至少一可执行指令，该计算机可执行指令可执行上述任意方法实施例中的页面交互方法。可执行指令具体可以用于使得处理器执行上述方法实施例中对应的各个操作。

实施例五

图4示出了根据本发明实施例五的一种电子设备的结构示意图，本发明具体实施例并不对电子设备的具体实现做限定。

如图4所示，该电子设备可以包括：处理器(processor)402、通信接口(communicationsinterface)406、存储器(memory)404、以及通信总线408。

其中：

处理器402、通信接口406、以及存储器404通过通信总线408完成相互间的通信。

通信接口406，用于与其它设备比如客户端或其它服务器等的网元通信。

处理器402，用于执行程序410，具体可以执行上述页面交互方法实施例中的相关步骤。

具体地，程序410可以包括程序代码，该程序代码包括计算机操作指令。

处理器402可能是中央处理器cpu，或者是特定集成电路asic(applicationspecificintegratedcircuit)，或者是被配置成实施本发明实施例的一个或多个集成电路。电子设备包括的一个或多个处理器，可以是同一类型的处理器，如一个或多个cpu；也可以是不同类型的处理器，如一个或多个cpu以及一个或多个asic。

存储器404，用于存放程序410。存储器404可能包含高速ram存储器，也可能还包括非易失性存储器(non-volatilememory)，例如至少一个磁盘存储器。

程序510具体可以用于使得处理器502执行上述方法实施例中对应的各个操作。

在此提供的算法和显示不与任何特定计算机、虚拟系统或者其它设备固有相关。各种通用系统也可以与基于在此的示教一起使用。根据上面的描述，构造这类系统所要求的结构是显而易见的。此外，本发明也不针对任何特定编程语言。应当明白，可以利用各种编程语言实现在此描述的本发明的内容，并且上面对特定语言所做的描述是为了披露本发明的最佳实施方式。

在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。

类似地，应当理解，为了精简本公开并帮助理解各个发明方面中的一个或多个，在上面对本发明的示例性实施例的描述中，本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本发明的单独实施例。

本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书(包括伴随的权利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。

此外，本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如，在下面的权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。

本发明的各个部件实施例可以以硬件实现，或者以在一个或者多个处理器上运行的软件模块实现，或者以它们的组合实现。本领域的技术人员应当理解，可以在实践中使用微处理器或者数字信号处理器(dsp)来实现根据本发明实施例的基于语音输入信息的抽奖系统中的一些或者全部部件的一些或者全部功能。本发明还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序(例如，计算机程序和计算机程序产品)。这样的实现本发明的程序可以存储在计算机可读介质上，或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到，或者在载体信号上提供，或者以任何其他形式提供。

应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制，并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中，不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中，这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。