基于瀑布流方式加载展示商品列表的方法、装置及客户端制造方法及图纸

本发明专利技术提供一种基于瀑布流方式加载展示商品列表的方法、装置及客户端，该方法包括：客户端在展示商品信息时，检测是否接收到商品信息页面移动的指令；若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息；其中，所述待展示的商品信息为商品信息所属的网站服务器中除所述商品信息所在页面之外的其他页面的商品信息。该方法能兼容PC端Web应用和移动端Web应用，提高用户体验。

Method, device and client for loading display commodity list based on waterfall flow mode

The present invention provides a method of loading waterfall flow display method, device and client based on the list of goods, the method comprises: a client in the display of goods information, detecting whether the received goods information page moving instruction; if the client receives the instruction, according to the instructions in the commodity information page at the same time the display of goods loading information; the other pages except the commodity information page outside of the display of goods information belongs to the commodity information commodity information in the web server. The method can be compatible with PC Web applications and mobile Web applications to improve the user experience.

【技术实现步骤摘要】

本专利技术涉及互联网络
，尤其涉及一种基于瀑布流方式加载展示商品列表的方法、装置及客户端。
技术介绍
目前，移动端应用发展迅速，移动应用使用的用户规模也大大增加，已有超过个人计算机(personalcomputer，简称PC)端互联网web应用的发展趋势，国内各大电商都已开发自己的移动端应用程序(Application，简称APP)或是移动端WebApp，而在商品列表展示模块，PC端大多采用的分页加载显示的传统方式，而如果在移动端也依旧采用这种传统方式，用户体验效果将大打折扣。因此为了提高用户体验，以及考虑到要兼容PC端Web应用和移动端的Web应用，我们采用一种使用滚动条拖动加载商品列表的方式来解决此问题，本专利技术基于Javascript脚本响应鼠标拖动事件以及移动端滑动手势以瀑布流方式加载商品数据；鉴于此，如何提供一种加载展示商品列表的方法、装置及客户端，以兼容PC端Web应用和移动端的Web应用，提高用户体验成为目前需要解决的技术问题。
技术实现思路
为解决上述的技术问题，本专利技术提供一种基于瀑布流方式加载展示商品列表的方法、装置及客户端，能够兼容PC端Web应用和移动端的Web应用，提高用户体验。第一方面，本专利技术提供一种基于瀑布流方式加载展示商品列表的方法，包括：客户端在展示商品信息时，检测是否接收到商品信息页面移动的指令；若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息；其中，所述待展示的商品信息为商品信息所属的网站服务器中除所述商品信息所在页面之外的其他页面的商品信息。可选地，所述客户端以瀑布流方式展示已加载的待展示的商品信息。可选地，所述客户端利用瀑布流插件，以瀑布流方式展示已加载的待展示的商品信息。可选地，在客户端展示商品信息之前，还包括：客户端向网站服务器发送商品信息查找指令，接收所述网站服务器返回的所查找商品信息的所有页面，并将所查找商品信息的所有页面存储在承载商品信息的div容器中，并展示所述div容器中存储的所查找商品信息的第一页面的商品信息；相应地，若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息，具体为若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载所述div容器中存储的待展示的商品信息。可选地，在所述客户端向网站服务器发送商品信息查找指令之后，还包括：若客户端没有接收到所述网站服务器返回的所查找商品信息的所有页面，则展示无商品可加载的提示信息。可选地，所述方法，还包括：若客户端展示的商品信息已经展示到所述商品信息的最后一页，则展示已加载到最后一页的提示信息。可选地，所述客户端利用上下左右滑动插件，检测是否接收到商品信息页面移动的指令。可选地，所述客户端为PC端或移动端中的客户端。第二方面，本专利技术提供一种基于瀑布流方式加载展示商品列表的装置，包括：检测模块，用于客户端在展示商品信息时，检测是否接收到商品信息页面移动的指令；加载模块，用于若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息；其中，所述待展示的商品信息为商品信息所属的网站服务器中除所述商品信息所在页面之外的其他页面的商品信息。第三方面，本专利技术提供一种客户端，包括：上述基于瀑布流方式加载展示商品列表的装置。由上述技术方案可知，本专利技术的基于瀑布流方式加载展示商品列表的方法、装置及客户端，基于Javascript脚本以及jQuery库，兼容PC端Web应用和移动端的Web应用，监听用户在浏览器的滚动事件或是移动端的滚动事件和滑动手势事件，从而实现无需手动点击分页页码加载商品的瀑布流加载的方案，能够提高用户体验。附图说明图1为本专利技术一实施例提供的一种基于瀑布流方式加载展示商品列表的方法的流程示意图；图2为本专利技术一实施例提供的一种基于瀑布流方式加载展示商品列表的装置的结构示意图；图3为本专利技术一实施例提供的一种客户端的结构示意图。具体实施方式为使本专利技术实施例的目的、技术方案和优点更加清楚，下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整的描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他的实施例，都属于本专利技术保护的范围。图1示出了本专利技术一实施例提供的基于瀑布流方式加载展示商品列表的方法的流程示意图，如图1所示，本实施例的基于瀑布流方式加载展示商品列表的方法如下所述。101、客户端在展示商品信息时，检测是否接收到商品信息页面移动的指令。在具体应用中，本实施例所述客户端可利用上下左右滑动插件，检测是否接收到商品信息页面移动的指令。在具体应用中，本实施例中的上下左右滑动插件可优选为jquery.swipe.js插件，但本实施例并不对其进行限制，本实施例还可以使用其他上下左右滑动插件。应说明的是，本实施例所述客户端为PC端或移动端中的客户端，PC端中的客户端可在监听到用户滚动鼠标滚轮(即监听到用户在PC端的滚动事件)时，接收到商品信息页面移动的指令；或者，移动端中的客户端可在监听到用户在移动端屏幕上向上向下滑动或监听到移动端的滚动事件时，接收到商品信息页面移动的指令。102、若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息。其中，所述待展示的商品信息为商品信息所属的网站服务器中除所述商品信息所在页面之外的其他页面的商品信息。在具体应用中，本实施例所述客户端以瀑布流方式展示已加载的待展示的商品信息。进一步地，本实施例所述客户端可利用瀑布流插件，以瀑布流方式展示已加载的待展示的商品信息。在具体应用中，本实施例中的瀑布流插件可优选为jquery.waterfall.js插件，但本实施例并不对其进行限制，本实施例还可以使用其他瀑布流插件。在具体应用中，在客户端展示商品信息之前，本实施例所述方法还可包括：客户端向网站服务器发送商品信息查找指令，接收所述网站服务器返回的所查找商品信息的所有页面，并将所查找商品信息的所有页面存储在承载商品信息的div容器中，并展示所述div容器中存储的所查找商品信息的第一页面的商品信息；相应地，若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息，具体为：若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载所述div容器中存储的待展示的商品信息。本实施例的基于瀑布流方式加载展示商品列表的方法，针对传统的电商网站以分页加载商品列表的不足，基于Javascript脚本以及jQuery库，兼容PC端Web应用和移动端的Web应用，监听用户在浏览器的滚动事件或是移动端的滚动事件和滑动手势事件，从而实现无需手动点击分页页码加载商品的瀑布流加载的方案，能够提高用户体验。进一步地，在所述客户端向网站服务器发送商品信息查找指令之后，还可包括：若客户端没有接收到所述网站服务器返回的所查找商品信息的所有页面，则展示无商品可加载的提示信息。在具体应用中，本实施例所述方法，还可包括：若客户端展示的商品信息已经展示到所述商品信息的最后一页，则展示已加载本文档来自技高网...

【技术保护点】
一种基于瀑布流方式加载展示商品列表的方法，其特征在于，包括：客户端在展示商品信息时，检测是否接收到商品信息页面移动的指令；若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息；其中，所述待展示的商品信息为商品信息所属的网站服务器中除所述商品信息所在页面之外的其他页面的商品信息。

【技术特征摘要】
1.一种基于瀑布流方式加载展示商品列表的方法，其特征在于，包括：客户端在展示商品信息时，检测是否接收到商品信息页面移动的指令；若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息；其中，所述待展示的商品信息为商品信息所属的网站服务器中除所述商品信息所在页面之外的其他页面的商品信息。2.根据权利要求1所述的方法，其特征在于，所述客户端以瀑布流方式展示已加载的待展示的商品信息。3.根据权利要求2所述的方法，其特征在于，所述客户端利用瀑布流插件，以瀑布流方式展示已加载的待展示的商品信息。4.根据权利要求1所述的方法，其特征在于，在客户端展示商品信息之前，还包括：客户端向网站服务器发送商品信息查找指令，接收所述网站服务器返回的所查找商品信息的所有页面，并将所查找商品信息的所有页面存储在承载商品信息的div容器中，并展示所述div容器中存储的所查找商品信息的第一页面的商品信息；相应地，若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载待展示的商品信息，具体为若客户端接收到所述指令，则根据所述指令在商品信息所属的页面内同时加载所述div容器中...

【专利技术属性】
技术研发人员：冯静芳，
申请(专利权)人：北大方正集团有限公司，北京北大方正电子有限公司，
类型：发明
国别省市：北京;11