一种页面浏览目录辅助方法

摘要

本发明提供了一种页面浏览目录辅助方法，包括以下步骤：a.捕获目录按钮点击事件；b.获取目录按钮状态；c.根据目录按钮状态进行目录初始化，创建目录窗体；d.捕捉与目录窗体相关的页面操作事件；e.根据页面操作事件类型，对目录窗体进行相应处理。本发明的意义在于脱离了传统互联网百科产品单一静态的目录显示方式，完全依据用户的阅读习惯建立了丰富动态的目录浏览与定位方法，填补了互联网行业中百科类产品中目录的实时浏览与定位的空白。

说明书

【技术领域】

本发明涉及网页浏览技术，特别涉及一种页面浏览目录辅助方法。

【背景技术】

随着互联网技术的发展，开放式知识共享平台服务于互联网络中业已广泛应用。知识共享平台由大量用户对各种词条进行编辑，用于帮助需要的人了解相关资讯。

当用户浏览或编辑的词条内容比较长时，为了使浏览者或编辑者有一个清楚的浏览方式和编辑印象，词条页面上通常需要有一个导航目录进行内容导航，方便浏览者或编辑者总览词条全文内容，以及通过点击导航目录直接到达指定的段落。导航目录是由词条内容中的目录标题所指定的。用户在浏览词条内容时可方便的通过导航目录浏览到导航目录中的内容。

然而目前知识共享平台的页面导航目录在编辑者进行编辑操作时并不能实时显示编辑者编辑的目录标题，导航目录的目录标题所对应的导航链接都是在内容被浏览时才显示的。随着内容的增长，编辑者往往需要在内容当中创建很多导航目录标题，如果不能实时显示导航目录列表，编辑者需要上下拖动页面才可以浏览到所有的导航目录标题，以确定这些目录是否设置妥当，这就影响了编辑者的编辑体验。

另外，传统的文档的导航目录多固定显示在文档头部，不方便用户浏览，而且也不支持跟随浏览或编辑页面同步移动。在用户浏览词条页面过程中，导航目录不会提示用户的浏览位置，尤其是在词条内容中存在相同导航目录标题的情况下，容易造成目录定位错误，降低了浏览者的浏览体验。

总而言之，目前的开放式知识共享平台对于目录浏览方面还存在诸多缺陷，亟需改善。

【发明内容】

为了避免以上现有技术的不足，本发明提供一种页面浏览目录辅助方法，以解决在编辑内容的同时实时显示导航目录的问题。

本发明提供了一种页面浏览目录辅助方法，包括以下步骤：a.捕获目录按钮点击事件；b.获取目录按钮状态；c.根据目录按钮状态进行目录初始化，创建目录窗体；d.捕捉与目录窗体相关的页面操作事件；e.根据页面操作事件类型，对目录窗体进行相应处理。

根据本发明一优选实施例，进一步包括步骤：f.根据目录按钮状态关闭目录窗体。

根据本发明一优选实施例，当目录按钮状态为展开状态时，关闭目录窗体。

根据本发明一优选实施例，在步骤c中，当目录按钮状态为未展开状态时，根据目录按钮状态进行目录初始化，创建目录窗体。

根据本发明一优选实施例，步骤c进一步包括以下步骤：c1.当前页面对应的词条正文，根据词条正文中的目录标记，获取当前词条中的目录信息；c2.根据获取的目录信息创建目录窗体；c3.保存当前的目录信息，记录目录窗体的当前位置。

根据本发明一优选实施例，步骤c2进一步包括以下步骤：c21.根据获取的目录信息的排列顺序，创建目录导航链接的序列；c22.将目录导航链接的序列尺寸与预设的目录窗体尺寸相比较；c23.根据比较结果调整目录导航链接的显示序列；c24.根据显示序列，创建目录窗体。

根据本发明一优选实施例，在步骤c22中，当目录导航链接的序列尺寸小于等于预设窗体尺寸时，则直接执行步骤c24；当目录导航链接的序列尺寸大于预设的目录窗体尺寸时，则执行步骤c23。

根据本发明一优选实施例，在步骤c23中，调整目录导航链接的显示序列的方式包括以下方式之一或其组合：c231.调整目录导航链接的显示序列的字体大小和行间距；c232.调整目录导航链接的显示序列中一级目录和二级目录的展开/收缩状态；c233.调整目录导航链接的显示序列的排列顺序。

根据本发明一优选实施例，步骤d和步骤e进一步包括以下步骤：d1.捕捉页面移动事件；e1.根据捕捉的页面移动事件，获取页面的位移值；e2.根据获取的页面的位移值，同步位移目录窗体。

根据本发明一优选实施例，步骤d和步骤e进一步包括以下步骤：d2.捕捉目录上扩展按钮点击事件；e3.将目录导航链接的显示序列顺序上移；e4.更新目录窗体的显示序列。

根据本发明一优选实施例，步骤d和步骤e进一步包括以下步骤：d3.捕捉目录下扩展按钮点击事件；e5.将目录导航链接的显示序列顺序下移；e6.更新目录窗体的显示序列。

根据本发明一优选实施例，步骤d和步骤e进一步包括以下步骤：d4.捕捉目录导航链接点击事件；e7.获取被点击的导航链接所对应的目录标题的页面位置；e8.获取页面的当前位置；e9.计算目录标题的页面位置与页面的当前位置之间的位移值；e10.同步位移页面和目录窗体。

根据本发明一优选实施例，步骤e8、步骤e9和步骤e10进一步包括以下步骤：e81.获取页面当前显示区域的顶行位置；e91.计算目录标题的页面位置与当前显示区域的顶行位置之间的位移值；e101.同步位移页面和目录窗体。

根据本发明一优选实施例，步骤e8、步骤e9和步骤e10进一步包括以下步骤：e82.获取页面当前显示区域的特定位置；e92.计算目录标题的页面位置与当前显示区域的特定位置之间的位移值；e102.同步位移页面和目录窗体。

根据本发明一优选实施例，页面的显示区域包括滚动条和多个目录锚点，方法还包括以下步骤：g.检测滚动条距离页面显示区域顶部的距离；h.检测每个目录锚点距离页面显示区域顶部的距离；i.进行比较计算，得到当前滚动条所在的对应目录锚点区间；j.标记当前目录锚点所对应的目录导航链接。

本发明提供的页面浏览目录辅助方法脱离了传统互联网百科产品单一静态的目录显示方式，完全依据用户的阅读习惯建立了丰富动态的目录浏览与定位方法，填补了互联网行业中百科类产品中目录的实时浏览与定位的空白。在此基础上，本发明还具有更进一步的有益效果：

(1)悬浮式目录的优化浏览。本发明的页面浏览目录辅助方法能够依据互联网用户浏览习惯建立实时的目录浏览通道，可利用当前锚点直接定位当前所在目录。

(2)文档内容的快速定位。本发明的页面浏览目录辅助方法通过对所有标题在网页中位置的记录，确保用户在页面任何位置都可以快速浏览定位到相关的目录标题和相应的内容位置，从而有效提升用户浏览体验。

【附图说明】

图1是本发明的处于未展开状态的目录页面示意图。

图2是本发明的处于展开状态的目录页面示意图。

图3是本发明的目录浏览处理方法的流程示意图。

图4是图3中目录初始化步骤的一种实施例的流程示意图。

图5是图4中根据获取的目录信息创建目录窗体步骤的一种实施例的流程示意图。

图6是本发明的位移之前的目录页面示意图。

图7是本发明的位移之后的目录页面示意图。

图8是本发明的目录同步跟随滚动条位移的处理步骤的流程示意图。

图9是本发明的目录上扩展处理步骤的流程示意图。

图10是本发明的目录下扩展处理步骤的流程示意图。

图11是本发明的目录定位处理步骤的流程示意图。

图12是图11中获取页面当前位置处理步骤的第一实施方式的流程示意图。

图13是图11中获取页面当前位置处理步骤的第二实施方式的流程示意图。

图14是本发明的目录锚点高亮显示的目录页面示意图。

图15是本发明的目录锚点高亮显示的处理步骤的流程示意图。

【具体实施方式】

为了使本发明的目的、技术方案和优点更加清楚，下面结合附图和具体实施例对本发明进行详细描述。

为使本领域的技术人员更加容易的理解本发明的技术方案，首先将对本发明所采用的目录浏览界面进行说明。

请参见图1和图2，图1是本发明的处于未展开状态的目录页面示意图。如图1所示，表示了用户浏览或编辑的词条内容的显示界面信息。页面浏览区域100中包括目录标题110、内容120和词条目录130。目录标题110包括一级目录(包括目录标题1、目录标题2、目录标题3)和二级目录(包括目录标题2.1、目录标题2.2)。目录标题110中各个目录标题的排列顺序依照目录标题1、目录标题2、目录标题3的序号由上至下依次排列。内容120位于所对应的目录标题110的下方。目录按钮131位于词条目录130上。图1中，由于词条目录130是向页面右方展开的，因此在未展开状态下，目录按钮131的箭头方向指向右侧。目录按钮131的箭头方向表示词条目录130的展开方向，即点击目录按钮131可以向箭头方向展开词条目录130。

图2是本发明的处于展开状态的目录页面示意图。如图2所示，词条目录130的目录窗体上包括多个导航链接132以及扩展按钮133。导航链接132与页面浏览区域100中的目录标题110相互对应，通过点击导航链接132，页面可以直接到达对应的目录标题所在的段落。其中的具体处理步骤将在后文详细叙述。扩展按钮133包括上扩展按钮和下扩展按钮。当导航链接132的序列长度超过词条目录130的目录窗体尺寸长度时，可以通过点击上扩展按钮或下扩展按钮来顺着对应的方向显示超出部分的导航链接序列。

图2中，词条目录130处于展开状态下，目录按钮131的箭头方向指向左侧，即点击目录按钮131可以关闭词条目录130。其中的具体处理步骤将在后文详细叙述。

以上简单描述了本发明所采用的目录浏览界面，下面将对该目录浏览界面的页面浏览目录辅助方法进行详细说明。

请参见图3，图3是本发明的目录浏览处理方法的流程示意图。

在步骤210中，捕获目录按钮点击事件。结合图1及上文所述，可以得知，在词条目录130处于未展开状态下，词条目录130的目录窗体是不显示的，这时用户无法获知目录信息。用户需要点击目录按钮131，才可以将词条目录130展开以显示目录窗体。因此，捕获目录按钮点击事件的目的就是为了确认用户对目录按钮的点击操作。

在步骤220中，获取目录按钮状态。请结合图1、图2和上文所示，当词条目录130处于未展开状态时，点击目录按钮131会展开词条目录130，创建词条目录130的目录窗体；当词条目录130处于展开状态时，点击目录按钮131会关闭词条目录130的目录窗体。因此在对词条目录130进行进一步处理之前，必须先获取目录按钮状态，以判断目录按钮是处于展开状态还是未展开状态。

在步骤230中，当从步骤230中获取了目录按钮状态之后，判断目录按钮是处于展开状态还是未展开状态。当目录按钮处于展开状态时，则执行步骤240，关闭词条目录130的目录窗体；当目录按钮处于未展开状态时，则进一步执行步骤250。

在步骤250中，进行目录初始化处理。请参见图4，图4是图3中目录初始化步骤的一种实施例的流程示意图。如图4所示，目录初始化步骤250进一步包括步骤251、步骤252和步骤253。

在步骤251中，检索当前页面对应的词条正文，根据词条正文中的目录标记，获取当前词条中的目录信息，目录信息包括目录标题、排列顺序等。

在步骤252中，根据获取的目录信息创建目录窗体。请参见图5，图5是图4中根据获取的目录信息创建目录窗体步骤的一种实施例的流程示意图。如图5所示，步骤252更进一步包括步骤2521、步骤2522、步骤2523、步骤2524以及步骤2525。

在步骤2521中，根据获取的目录信息的排列顺序，创建目录导航链接的序列。

在步骤2522中，将目录导航链接的序列尺寸与预设的目录窗体尺寸相比较。在词条显示时，词条目录所能够占据的区域尺寸是有一定限制的，词条目录不能覆盖其他信息显示区域。因此，在本发明的优选实施方式中，词条目录的目录窗体是有最大尺寸限制的。在这种情况下，当目录导航链接的序列尺寸大于目录窗体的最大尺寸限制时，就需要对目录导航链接的序列进行调整，以显示最适宜的内容。

在步骤2523中，判断目录导航链接的序列尺寸与预设的目录窗体尺寸的大小关系，当目录导航链接的序列尺寸大于预设的目录窗体尺寸时，则执行步骤2524；当目录导航链接的序列尺寸小于等于预设的目录窗体尺寸时，则执行步骤2525。

在步骤2524中，调整目录导航链接的显示序列。

当目录导航链接的序列尺寸大于预设窗体尺寸时，表示当前的目录窗体尺寸大于目录窗体的最大尺寸限制，需要对目录导航链接的序列进行调整。在本发明的实施例中，调整目录导航链接的显示序列的方式包括但不限于以下方式：

a.调整目录导航链接的显示序列字体大小和行间距；

b.调整目录导航链接的显示序列中一级目录和二级目录的展开/收缩状态；

c.调整目录导航链接的显示序列的排列顺序，这其中包括多种方式，例如：由第一个目录标题向下依次排序，当序列长度大于预设窗体尺寸时，隐藏向下排序的序列中大于预设窗体尺寸的部分；以当前浏览的目录标题为中心，分别向上下两侧排序，当序列长度大于预设窗体尺寸时，隐藏向两侧排序的序列中大于预设窗体尺寸的部分；由最后一个目录标题向上依次排序，当序列长度大于预设窗体尺寸时，隐藏向上排序的序列中大于预设窗体尺寸的部分。

在步骤2525中，根据显示序列，创建目录窗体。

以上是对图5所示的根据获取的目录信息创建目录窗体步骤252的一种实施例的说明，下面衔接上文对图4的处理步骤进行顺序描述。

在步骤253中，保存当前的目录信息，记录目录窗体的当前位置。当目录窗体创建完之后，为了方便对目录窗体和目录信息的后续操作，例如同步位移、目录定位、当前浏览位置标记显示等，需要保存当前的目录信息，并记录目录窗体的当前位置。

以上是对图4所示的目录初始化步骤250的一种实施例的说明，下面衔接上文对图3的目录浏览处理方法的处理步骤进行顺序描述。

在步骤260中，捕捉与目录相关的页面操作事件。

在步骤270中，根据页面操作事件类型，对目录进行相应处理。

下面本发明将根据不同类型的页面操作事件，对步骤260和步骤270的处理步骤进行详细说明。

值得指出的是，本发明说明书中所列举的不同类型的页面操作事件及其处理步骤，是为了使本领域技术人员更易于理解本发明的实施例，并非用于限定本发明的页面操作事件的涵盖范围。

本发明下述的一个实施例是关于本发明的目录页面同步位移的具体实施方案。图6是本发明的位移之前的目录页面示意图。图7是本发明的位移之后的目录页面示意图。如图6所示，在位移之前，页面显示区域的首行的行号为A行。如图7所示，在位移之后，页面显示区域的首行的行号为A’行，即页面区域的位移值d为(A’-A)行。

请参见图8，图8是本发明的目录同步跟随滚动条位移的处理步骤的流程示意图。

在步骤261中，捕捉页面移动事件。捕获页面移动事件的目是为了确认用户对页面的移动操作。

在步骤271中，根据捕捉的页面移动事件，获取页面的位移值。页面的位移值某个显示区域的行号变化来计算，例如是计算显示区域中首行的行号变化，即可以获得页面的位移值所对应的行数。

在步骤272中，根据获取的页面的位移值，同步位移目录窗体，使得目录窗体与页面滚动条保持同步移动，这样一来，对于用户来说目录窗体相对于页面的显示位置就会保持相对固定。

请参见图9，图9是本发明的目录上扩展处理步骤的流程示意图。请结合图2所示，当导航链接132的序列长度超过词条目录130的目录窗体尺寸长度时，可以通过点击上扩展按钮或下扩展按钮来顺着对应的方向显示超出部分的导航链接序列。

在步骤262中，捕捉目录上扩展按钮点击事件。

在步骤2771中，将目录导航链接的显示序列顺序上移。

在步骤2772中，更新目录窗体的显示序列。

请参见图10，图10是本发明的目录下扩展处理步骤的流程示意图。

在步骤263中，捕捉目录下扩展按钮点击事件。

在步骤2781中，将目录导航链接的显示序列顺序下移。

在步骤2782中，更新目录窗体的显示序列。

请参见图11，图11是本发明的目录定位处理步骤的流程示意图。请结合图2所示，导航链接132与页面浏览区域100中的目录标题110相互对应，通过点击导航链接132，页面可以直接到达对应的目录标题所在的段落。

在步骤264中，捕捉目录导航链接点击事件。

在步骤273中，获取被点击的导航链接所对应的目录标题的页面位置。

在步骤274中，获取页面当前位置。

在步骤275中，计算目录标题的页面位置与页面当前位置之间的位移值。

在步骤276中，同步位移页面和目录窗体。

在本发明中，步骤274、275、276的处理方法包括多种实施例，以下将举例说明获取页面当前位置及其后续的处理步骤。

请参见图12，图12是图11中获取页面当前位置处理步骤的第一实施方式的流程示意图。

在步骤2741中，获取页面当前显示区域的顶行位置。

在步骤2751中，计算目录标题的页面位置与当前显示区域的顶行位置之间的位移值。

在步骤2761中，同步位移页面和目录窗体。

请参见图13，图13是图11中获取页面当前位置处理步骤的第二实施方式的流程示意图。

在步骤2742中，获取页面当前显示区域的特定位置。

在步骤2752中，计算目录标题的页面位置与当前显示区域的特定位置之间的位移值。

在步骤2762中，同步位移页面和目录窗体。

图14是本发明的目录锚点高亮显示的目录页面示意图。本发明目录锚点高亮显示的技术方案所实现的效果是当滚动页面的时候，会根据滚动到相应的位置去给相应的目录锚点(也就是目录的导航链接)加上高亮的显示效果，方便用户浏览。如图15所示，目录标题1距离页面显示区域顶部的距离为d1，目录标题2距离页面显示区域顶部的距离为d2，滚动条距离页面显示区域顶部的距离为d3，滚动条位于目录标题1与目录标题2之间，对应于目录标题1的内容区域，因此词条目录中目标标题1所对应的导航链接区域被标记为高亮显示状态。

请参见图15，图15是本发明的目录锚点高亮显示的处理步骤的流程示意图。

在步骤310中，检测滚动条距离页面显示区域顶部的距离。

在步骤320中，检测每个目录锚点距离页面显示区域顶部的距离。

在步骤330中，进行比较计算，得到当前滚动条所在的对应目录锚点区间。

在步骤340中，标记当前目录锚点所对应的目录导航链接。例如将当前目录锚点所对应的目录导航链接作高亮显示或变色显示。

在本发明的其他实施方式中，还可以采用页面显示区域的特定位置，例如是显示区域的中间位置或中间偏上位置，作为与目录锚点相比较的对象，当然，本发明也可以采用光标位置作为与目录锚点相比较的对象。上述实施例仅是为了举例说明，并非用于限定本发明的实施方式，只要是位于页面显示区域内方便用户浏览的相对固定位置，均可作为与目录锚点相比较的对象。

本发明提供的页面浏览目录辅助方法脱离了传统互联网百科产品单一静态的目录显示方式，完全依据用户的阅读习惯建立了丰富动态的目录浏览与定位方法，填补了互联网行业中百科类产品中目录的实时浏览与定位的空白。在此基础上，本发明还具有更进一步的有益效果：

(1)悬浮式目录的优化浏览。本发明的页面浏览目录辅助方法能够依据互联网用户浏览习惯建立实时的目录浏览通道，可利用当前锚点直接定位当前所在目录。

(2)文档内容的快速定位。本发明的页面浏览目录辅助方法通过对所有标题在网页中位置的记录，确保用户在页面任何位置都可以快速浏览定位到相关的目录标题和相应的内容位置，从而有效提升用户浏览体验。

以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本发明保护的范围之内。