CN103902258A - 一种在网页中实现自定义菜单显示的方法及装置 - Google Patents
一种在网页中实现自定义菜单显示的方法及装置 Download PDFInfo
- Publication number
- CN103902258A CN103902258A CN201210568532.6A CN201210568532A CN103902258A CN 103902258 A CN103902258 A CN 103902258A CN 201210568532 A CN201210568532 A CN 201210568532A CN 103902258 A CN103902258 A CN 103902258A
- Authority
- CN
- China
- Prior art keywords
- custom menu
- configuration information
- menu
- menu item
- custom
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Landscapes
- User Interface Of Digital Computer (AREA)
Abstract
本发明实施例公开了一种在网页中实现自定义菜单显示的方法及装置，其中，所述方法包括：在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息；根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。采用本发明，能够根据用户右键点击时鼠标光标所处的页面元素生成配置信息，并生成对应的菜单供用户选择，实现了丰富的动态自定义菜单的功能。
Description
技术领域
本发明涉及自定义菜单显示技术领域，尤其涉及一种在网页中实现自定义菜单显示的方法及装置。
背景技术
在计算机领域中，右键菜单是指用户在运行计算机过程中，通过点击鼠标右键而弹出的包括多个选项的列表，在右键菜单中，用户可以点击左键选择其中的一个选项以进行相应的控制操作，而如果在菜单外点击左键，则计算机***会隐藏该右键菜单。现有的右键菜单为***菜单，包括已经设置好的各类不同的菜单项，***菜单中的菜单项作为相应功能的入口提供给用户，以便用户快捷地打开相应的处理功能对当前右键点击时所处位置的元素进行处理。
现有技术中，右键菜单是静态的，即各菜单项均已预先制作确定，并不能够根据当前右键点击时所处位置的页面元素动态生成并加载自定义菜单。
发明内容
本发明实施例所要解决的技术问题在于，提供一种在网页中实现自定义菜单显示的方法及装置，可进行动态自定义菜单的生成以及显示。
为了解决上述技术问题，本发明实施例提供了一种在网页中实现自定义菜单显示的方法，包括：
在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息；
根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
其中，所述在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息，包括：
在监测到右键点击操作事件时，判断鼠标光标当前所处位置是否位于需要显示自定义菜单的页面元素的位置；
若是，则确定显示自定义菜单，根据鼠标光标当前所处位置的页面元素生成配置信息。
其中，所述根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单，包括：
根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项；
将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
其中，所述自定义菜单的宽度值为生成的自定义菜单项中宽度的最大值。
其中，所述根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项，包括：
绘制文档对象模型节点；
根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的菜单项图标生成图标节点；
将生成的文本节点和/或图标节点构成自定义菜单项。
其中，所述根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项，包括：
绘制文档对象模型节点；
根据配置信息中所指示的菜单项文本和/或菜单项图标，并根据所述文档对象模型节点，生成自定义菜单项；
在所述文档对象模型节点中增加子菜单节点，以指示所述生成的自定义菜单项包括子菜单；
根据配置信息中所指示的子菜单项文本和/或子菜单项图标，生成对应的各子菜单项，得到子菜单；
将所述子菜单与所述生成的自定义菜单项关联。
其中，还包括：
在检测到鼠标进入事件时，若所述鼠标进入事件关联的自定义菜单项包括子菜单，则进一步显示生成的子菜单项；
在检测到鼠标离开事件时，将显示的子菜单项隐藏，并在检测到点击操作时，隐藏所述显示的自定义菜单。
其中，所述根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单，还包括：
禁止将对所述得到的自定义菜单上的鼠标操作事件冒泡给该自定义菜单所属的父节点，所述鼠标操作事件包括鼠标弹起事件、鼠标按下事件、鼠标点击事件中的任一种或多种。
其中，所述显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单之前，还包括：
构造自定义菜单边框的装饰性节点，以便于在所述显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。
相应地，本发明实施例还提供了一种在网页中实现自定义菜单显示的装置，包括：
生成模块，用于在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息；
获取模块，用于根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
显示模块，用于显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
其中，所述生成模块包括：
判断单元，用于在监测到右键点击操作事件时，判断鼠标光标当前所处位置是否位于需要显示自定义菜单的页面元素的位置；
生成单元，用于所述判断单元的判断结果为是时，则确定显示自定义菜单，根据鼠标光标当前所处位置的页面元素生成配置信息。
其中，所述获取模块包括：
菜单项生成单元，用于根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项；
菜单生成单元，用于将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
其中，所述自定义菜单的宽度值为生成的自定义菜单项中宽度的最大值。
其中，所述菜单项生成单元包括：
第一绘制子单元，用于绘制文档对象模型节点；
第一生成子单元，用于根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的菜单项图标生成图标节点；
第一构造子单元，用于将生成的文本节点和/或图标节点构成自定义菜单项。
其中，所述菜单项生成单元包括：
第二绘制子单元，用于绘制文档对象模型节点；
第二生成子单元，用于根据配置信息中所指示的菜单项文本和/或图标，并根据所述文档对象模型节点，生成菜单项；
节点生成子单元，用于在所述文档对象模型节点中增加子菜单节点，以指示所述生成的自定义菜单项包括子菜单；
第三生成子单元，用于根据配置信息中所指示的子菜单项文本和/或子菜单项图标，生成对应的各子菜单项，得到子菜单；
关联子单元，用于将所述子菜单与所述生成的自定义菜单项关联。
其中，还包括：
子菜单显示模块，用于在检测到鼠标进入事件时，若所述鼠标进入事件关联的自定义菜单项包括子菜单，则进一步显示生成的子菜单项；
隐藏模块，用于在检测到鼠标离开事件时，将显示的子菜单项隐藏，并在检测到点击操作时，隐藏所述显示的自定义菜单。
其中，还包括：屏蔽模块，用于禁止将对所述得到的自定义菜单上的鼠标操作事件冒泡给该自定义菜单所属的父节点，所述鼠标操作事件包括鼠标弹起事件、鼠标按下事件、鼠标点击事件中的任一种或多种。
其中，还包括：构造模块，用于构造自定义菜单边框的装饰性节点，以便于在所述显示模块显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。
实施本发明实施例，具有如下有益效果：
本发明能够根据用户右键点击时鼠标光标所处的页面元素生成配置信息，并生成对应的菜单供用户选择，实现了丰富的动态自定义菜单的功能。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1是本发明实施例的一种在网页中实现自定义菜单显示的方法的流程示意图；
图2是本发明实施例的另一种在网页中实现自定义菜单显示的方法的流程示意图；
图3是本发明实施例的生成在网页中实现自定义菜单的方法的流程示意图；
图4是本发明实施例的一种在网页中实现自定义菜单显示的装置的结构示意图；
图5是本发明实施例的另一种在网页中实现自定义菜单显示的装置的结构示意图；
图6是图5中的菜单项生成单元的其中一种具体结构示意图；
图7是图5中的菜单项生成单元的其中另一种具体结构示意图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
图1是本发明实施例的一种在网页中实现自定义菜单显示的方法的流程示意图；本发明实施例的所述方法可应用在各类电脑等待鼠标功能的终端设备中，具体的，本实施例的所述方法包括：
S101：在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息。
在检测到右键点击操作事件时，可根据用户当前点击的位置来确定应该显示***菜单，还是显示自定义菜单，如果用户右键点击时鼠标光标所处的位置为电脑桌面，或者网页页面的空白处等地方，则需要显示默认的***菜单，而如果是位于一些预先被指定为需要显示自定义菜单的对象所处的位置，例如预先指定了图片是需要显示自定义菜单的图片对象，而鼠标光标所处位置为一张图片时，则需要显示自定义菜单，需要根据个人电脑等终端设备中的功能程序，根据鼠标光标当前所处位置的页面元素生成配置信息，例如，根据鼠标光标当前所处位置的页面元素为图片时，则根据***的功能程序，生成包括放大、缩小等配置项，以及根据美图修饰的用于进行图片处理的功能程序确定的名为美图修饰配置项等。
所述配置信息中自定义菜单的标题ID，该自定义菜单中每个自定义菜单项的文本信息、图标信息等，所述配置信息的生成步骤可以包括：从终端***中已安装的功能中，选择能够对鼠标光标当前所处位置的页面元素进行处理的功能，然后将用于描述此类功能的文本信息和/或图标信息等信息加入到配置模板中得到配置信息，而该配置模板的标题则作为此次生成的自定义菜单的标题。
S102：根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
可以为根据配置信息中的文本信息和/或图标信息首先生成各个自定义菜单项，然后根据各个自定义菜单项中的最大宽度，来确定菜单节点的宽度，并把自定义菜单项添加到菜单节点中，得到包括所有自定义菜单项的自定义菜单。
具体生成自定义菜单项的步骤可以包括：绘制文档对象模型节点；根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的自定义菜单项图标生成图标节点；将生成的文本节点和/或图标节点构成自定义菜单项。
S103：显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
将生成的自定义菜单显示给用户，以便于用户点击选中其中的某一自定义菜单项后，调用对应的功能程序对所述元素执行相应的处理。需要说明的是，自定义菜单中的自定义菜单项可以采用类似于快捷方式的处理方法进行处理，以实现处理功能接口的功能，其具体实施过程可参考现有的实现方式。
通过上述实施例的描述可知，本发明实施例具有以下有益效果：
本发明能够根据用户右键点击时鼠标光标所处的页面元素生成配置信息，并生成对应的菜单供用户选择，实现了丰富的动态自定义菜单的功能。
再请参见图2，是本发明实施例的另一种在网页中实现自定义菜单显示的方法的流程示意图；本发明实施例的所述方法可应用在各类电脑等待鼠标功能的终端设备中，并且同时以在本实施例中以windows操作***中实现所述在网页中实现自定义菜单显示的方法为例进行详细说明，具体的，本实施例的所述在网页中实现自定义菜单显示的方法包括：
S201：在监测到右键点击操作事件时，判断鼠标光标当前所处位置是否位于需要显示自定义菜单的页面元素的位置。
S202：若是，则确定显示自定义菜单，根据鼠标光标当前所处位置的页面元素生成配置信息。
在检测到右键点击操作事件时，可根据用户当前点击的位置来确定应该显示***菜单，还是显示自定义菜单，如果用户右键点击时鼠标光标所处的位置为电脑桌面，或者网页页面的空白处等地方，则需要显示默认的***菜单，而如果是位于一些预先被指定为需要显示自定义菜单的对象所处的位置，例如预先指定了图片是需要显示自定义菜单的图片对象，而鼠标光标所处位置为一张图片时，则需要显示自定义菜单。
具体的，可以在网页页面的根节点document中监听右键点击contextmenu事件，在该事件处理方法中，根据window.event.returnValue变量的值或者该右键点击事件的enableDefaultContextMenu属性的值来决定是否显示***菜单。可以通过向外暴露useDefaultContextMenu方法根据鼠标右键点击时所处的位置的页面元素，来控制其中的window.event.returnValue变量的值或者enableDefaultContextMenu属性的值，从而确定显示***菜单还是自定义菜单。
其中，所述的window.event.returnValue变量是指：在IE内核的浏览器中，window.event是一个全局对象，当有事件触发时，会修改里面的returnValue的值。所述的enableDefaultContextMenu属性是指：在非IE内核的浏览器中，会将事件的相关属性信息作为第一个参数传递给事件处理方法。
S203：根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
在生成菜单节点的同时，还可以根据需要构造自定义菜单边框的装饰性节点，以便于在所述显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。
具体实现时，采用初始化方法init，该init方法的参数为所述配置信息中的配置项，根据配置项提供的ID，或者页面中已生成的自定义菜单数目生成一个ID为contextmenu_XX的div节点，并构造自定义菜单边框的装饰性节点，将需要显示的自定义菜单项添加到所述contextmenu_XX的div节点中。
进一步具体的，还可以禁止将对所述得到的自定义菜单上的鼠标操作事件冒泡给该自定义菜单所属的父节点，所述鼠标操作事件包括鼠标弹起事件、鼠标按下事件、鼠标点击事件中的任一种或多种。即禁止自定义菜单上的鼠标弹起mouseup、鼠标按下mousedown以及鼠标点击事件click事件的冒泡，这类事件只是与相应的自定义菜单交互，不应该冒泡给父级元素。
S204：显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
即将已经添加了所有生成的自定义菜单项的自定义菜单显示给用户。具体可以通过控制层叠样式表css的样式，设置自定义菜单可见即完成了自定义菜单的显示。
具体实现时，在自定义菜单的显示show方法中，可以相应添加鼠标进入mouseenter和鼠标移出mouseleave事件，当鼠标光标进入自定义菜单时，设置其中的_isHovered属性为true，表示光标位于自定义菜单内，而移出自定义菜单时，则将其置为false，同时，可以在documen.body上绑定鼠标点击click事件，这样，当鼠标移出并点击其他地方时，当前显示的所述自定义菜单便会消失，而在隐藏hide方法中，可以移除鼠标进入、鼠标移出以及鼠标点击事件，以减少内存的使用。
S205：在检测到鼠标进入事件时，若所述鼠标进入事件关联的自定义菜单项包括子菜单，则进一步显示生成的子菜单项。
子菜单项继承于自定义菜单项，在根据配置信息生成自定义菜单项时，若该自定义菜单项包括子菜单，则需要在该自定义菜单项中增加一个用于指示该自定义菜单项含有子菜单的节点，而子菜单中每一项的生成方式与自定义菜单项的生成方式相同。
S206：在检测到鼠标离开事件时，将显示的子菜单项隐藏，并在检测到点击操作时，隐藏所述显示的自定义菜单。
同样，子菜单上同样绑定相应的鼠标进入、鼠标移出以及鼠标点击事件等，以实现相应子菜单的显示、点击启用或者隐藏等。
进一步的具体的，再请参见图3，是本发明实施例的生成自定义菜单的方法的流程示意图；如上所述，所设计的配置信息是根据页面元素，并根据***中已存在的功能程序获得。具体的，生成所述自定义菜单的方法具体包括：
S301：根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项。
所述S301具体可以包括：绘制文档对象模型节点；根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的菜单项图标生成图标节点；将生成的文本节点和/或图标节点构成自定义菜单项。
具体实现时，可以通过***的调用增加元素additems方法，生成对应的菜单项ContextMenuItem(右键菜单元素)，然后通过计算出每个菜单项的宽度来决定菜单的最大宽度。每个菜单项的宽度值是通过getTextWidth方法完成，该getTextWidth方法的实现为：在页面中创建一个文本节点，将其位置设为可视窗口外，添加至页面可视元素的根节点body节点中，获取其offsetWidth属性即元素的可视宽度即可。
对于ContextMenuItem对象，在对其初始化方法init中，调用render方法绘制文档对象模型dom节点，如果配置信息中除含有文本外，还含有图标icon信息，则在自定义菜单项的文本节点前添加图片节点，否则只生成文本节点。绘制完成后，在dom节点上添加点击click事件，事件处理中，如果有对应的正在点击onclick属性并且菜单项是启用状态，首先调用onclick方法，然后逐级调用onclickDocument方法将其隐藏。否则，不作任何处理。
如果根据配置信息确定某一自定义菜单的菜单项包括子菜单，那么，所述S301具体可以包括：绘制文档对象模型节点；根据配置信息中所指示的菜单项文本和/或菜单项图标，并根据所述文档对象模型节点，生成自定义菜单项；在所述文档对象模型节点中增加子菜单节点，以指示所述生成的自定义菜单项包括子菜单；根据配置信息中所指示的子菜单项文本和/或子菜单项图标，生成对应的各子菜单项，得到子菜单；将所述子菜单与所述生成的自定义菜单项关联。
即除了通过上述具体实现时得到的子菜单项，还包括某一自定义菜单项的子菜单项的设置与生成，即还包括ContextSubmenuItem即子菜单元素。所述的ContextSubmenuItem继承于上述的ContextMenuItem对象，是实现多级菜单的关键。在初始化init方法中，同样调用render绘制文档对象模型dom节点，增加一个‘<span class=“subicom”></span>’节点用于指示该自定义菜单项含有子菜单。其click事件也与ContextMenuItem对象的类似，只是不在子菜单上隐藏父级菜单即该子菜单所述自定义菜单项的自定义菜单。为了实现多级菜单，其也添加了鼠标进入mouseenter和鼠标移出mouseleave事件，如果该子菜单所在自定义菜单项启用了，则显示或者隐藏相应的子菜单项，如果是禁用状态，则不作处理。
在子菜单上监听mouseenter以及mouseleave事件，在监听到所述mouseenter事件时，给该子菜单所在自定义菜单项的节点上添加contextmenuitem_hover类，利用css来实现选中态的效果；而在监听到所述mouseleave事件时，则隐藏该子菜单，并移除子菜单所在自定义菜单项的节点的contextmenuitem_hover类，取消选中态。
S302：将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
将生成的每一个自定义菜单项添加到所述菜单节点中，即可实现自定义菜单。需要说明的是，自定义菜单中的自定义菜单项可以采用类似于快捷方式的处理方法进行处理，以实现处理功能接口的功能，其具体实施过程可参考现有的实现方式。
本发明能够根据用户右键点击时鼠标光标所处的页面元素生成配置信息，并生成对应的菜单供用户选择，实现了丰富的动态自定义菜单的功能，并且由于自定义菜单的父节点或者祖先节点可能也添加了鼠标操作的响应事件，如果自定义菜单的鼠标操作等事件冒泡到其祖先节点，刚会触发祖先节点相关的处理器，造成误操作，因此，本发明实施例中，禁止自定义菜单中的鼠标事件向上冒泡，可有效避免误操作的产生。进一步的，自定义菜单的实现以及处理对***资源的占用较低，在菜单被隐藏后，该自定义菜单相应的事件***等被移除，进一步的避免了***资源的浪费。
下面对本发明的自定义显示装置进行详细说明。
请参见图4，是本发明实施例的一种在网页中实现自定义菜单显示的装置的结构示意图；本发明实施例的所述自定义菜单可应用于个人电脑等终端设备中，具体可以包括：
生成模块1，用于在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息；
获取模块2，用于根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
显示模块3，用于显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
所述生成模块1在检测到右键点击操作事件时，可根据用户当前点击的位置来确定应该显示***菜单，还是显示自定义菜单，如果用户右键点击时鼠标光标所处的位置为电脑桌面，或者网页页面的空白处等地方，则需要显示默认的***菜单，而如果是位于一些预先被指定为需要显示自定义菜单的对象所处的位置，例如预先指定了图片是需要显示自定义菜单的图片对象，而鼠标光标所处位置为一张图片时，则需要显示自定义菜单。
所述配置信息中自定义菜单的标题ID，该自定义菜单中每个自定义菜单项的文本信息、图标信息等，所述配置信息的生成步骤可以包括：从终端***中已安装的功能中，选择能够对鼠标光标当前所处位置的页面元素进行处理的功能，然后将用于描述此类功能的文本信息和/或图标信息等信息加入到配置模板中得到配置信息，而该配置模板的标题则作为此次生成的自定义菜单的标题。
所述获取模块2可以为根据配置信息中的文本信息和/或图标信息首先生成各个自定义菜单项，然后根据各个自定义菜单项中的最大宽度，来确定菜单节点的宽度，并把自定义菜单项添加到菜单节点中，得到包括所有自定义菜单项的自定义菜单。
所述获取模块2获取自定义菜单具体可以为：绘制文档对象模型节点；根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的自定义菜单项图标生成图标节点；将生成的文本节点和/或图标节点构成自定义菜单项。
所述显示模块3将生成的自定义菜单显示给用户，以便于用户点击选中其中的某一自定义菜单项后，调用对应的功能程序对所述元素执行相应的处理。需要说明的是，自定义菜单中的自定义菜单项可以采用类似于快捷方式的处理方法进行处理，以实现处理功能接口的功能，其具体实施过程可参考现有的实现方式。
通过上述实施例的描述可知，本发明具有以下优点：
本发明能够根据用户右键点击时鼠标光标所处的页面元素生成配置信息，并生成对应的菜单供用户选择，实现了丰富的动态自定义菜单的功能。
再请参见图5至图7，对本发明实施例的另一种在网页中实现自定义菜单显示的装置进行说明，本发明实施例的所述装置可以设置在个人电脑等终端设备中，图5是本发明实施例的另一种在网页中实现自定义菜单显示的装置的结构示意图；所述装置包括上一实施例中的生成模块1、获取模块2以及显示模块3，进一步的，请参见图5，所述生成模块1具体可以包括：
判断单元11，用于在监测到右键点击操作事件时，判断鼠标光标当前所处位置是否位于需要显示自定义菜单的页面元素的位置；
生成单元12，用于所述判断单元11的判断结果为是时，则确定显示自定义菜单，根据鼠标光标当前所处位置的页面元素生成配置信息。
在检测到右键点击操作事件时，所述判断单元11可根据用户当前点击的位置来确定应该显示***菜单，还是显示自定义菜单，如果用户右键点击时鼠标光标所处的位置为电脑桌面，或者网页页面的空白处等地方，则需要显示默认的***菜单，而如果是位于一些预先被指定为需要显示自定义菜单的对象所处的位置，例如预先指定了图片是需要显示自定义菜单的图片对象，而鼠标光标所处位置为一张图片时，则需要显示自定义菜单，所述生成单元12则需要根据个人电脑等终端设备中的功能程序，根据鼠标光标当前所处位置的页面元素生成配置信息。
进一步的，再请参见图5，所述获取模块2还可以包括：
菜单项生成单元21，用于根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项；
菜单生成单元22，用于将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
其中，所述自定义菜单的宽度值为生成的自定义菜单项中宽度的最大值。
在所述生成模块1生成菜单节点的同时，还可以根据需要构造自定义菜单边框的装饰性节点，以便于在所述显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。请参见图5，本实施例的所述装置还可以包括：
构造模块4，用于构造自定义菜单边框的装饰性节点，以便于在所述显示模块显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。以及
屏蔽模块5，用于禁止将对所述得到的自定义菜单上的鼠标操作事件冒泡给该自定义菜单所属的父节点，所述鼠标操作事件包括鼠标弹起事件、鼠标按下事件、鼠标点击事件中的任一种或多种。
进一步请参见图6，是图5中的菜单项生成单元的其中一种具体结构示意图；所述菜单项生成单元21包括：
第一绘制子单元211，用于绘制文档对象模型节点；
第一生成子单元212，用于根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的菜单项图标生成图标节点；
第一构造子单元213，用于将生成的文本节点和/或图标节点构成自定义菜单项。
而如果根据配置信息确定某一自定义菜单的菜单项包括子菜单，那么，再请参见图7，是图5中的菜单项生成单元的其中另一种具体结构示意图。
所述菜单项生成单元21包括：
第二绘制子单元214，用于绘制文档对象模型节点；
第二生成子单元215，用于根据配置信息中所指示的菜单项文本和/或图标，并根据所述文档对象模型节点，生成菜单项；
节点生成子单元216，用于在所述文档对象模型节点中增加子菜单节点，以指示所述生成的自定义菜单项包括子菜单；
第三生成子单元217，用于根据配置信息中所指示的子菜单项文本和/或子菜单项图标，生成对应的各子菜单项，得到子菜单；
关联子单元218，用于将所述子菜单与所述生成的自定义菜单项关联。
上述两种结构图可同时设置于所述菜单项生成单元21，以便于所述菜单项生成单元21可以根据配置信息，不仅进行单独的菜单项的生成操作，还可以在某菜单项包括子菜单时，能够生成对应的子菜单项，得到子菜单。
进一步的，再请参见图5，本实施例的所述装置还可以包括：
子菜单显示模块6，用于在检测到鼠标进入事件时，若所述鼠标进入事件关联的自定义菜单项包括子菜单，则进一步显示生成的子菜单项。
隐藏模块7，用于在检测到鼠标离开事件时，将显示的子菜单项隐藏，并在检测到点击操作时，隐藏所述显示的自定义菜单。
同样，子菜单上同样绑定相应的鼠标进入、鼠标移出以及鼠标点击事件等，以实现相应子菜单的显示、点击启用或者隐藏等。并且子菜单中各菜单项同样可以采用类似于快捷方式的处理方法进行处理，以实现处理功能接口的功能，其具体实施过程可参考现有的实现方式。
通过上述实施例的描述可知，本发明具有以下优点：
本发明能够根据用户右键点击时鼠标光标所处的页面元素生成配置信息，并生成对应的菜单供用户选择，实现了丰富的动态自定义菜单的功能，并且由于自定义菜单的父节点或者祖先节点可能也添加了鼠标操作的响应事件，如果自定义菜单的鼠标操作等事件冒泡到其祖先节点，刚会触发祖先节点相关的处理器，造成误操作，因此，本发明实施例中，禁止自定义菜单中的鼠标事件向上冒泡，可有效避免误操作的产生。进一步的，自定义菜单的实现以及处理对***资源的占用较低，在菜单被隐藏后，该自定义菜单的相应的事件***等被移除，进一步的避免了***资源的浪费。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于一计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，所述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory，ROM)或随机存储记忆体(Random Access Memory，RAM)等。
以上所揭露的仅为本发明较佳实施例而已，当然不能以此来限定本发明之权利范围，因此依本发明权利要求所作的等同变化，仍属本发明所涵盖的范围。
Claims (16)
1.一种在网页中实现自定义菜单显示的方法，其特征在于，包括：
在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息；
根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
2.如权利要求1所述的方法，其特征在于，所述在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息，包括：
在监测到右键点击操作事件时，判断鼠标光标当前所处位置是否位于需要显示自定义菜单的页面元素的位置；
若是，则确定显示自定义菜单，根据鼠标光标当前所处位置的页面元素生成配置信息。
3.如权利要求2所述的方法，其特征在于，所述根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单，包括：
根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项；
将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
其中，所述自定义菜单的宽度值为生成的自定义菜单项中宽度的最大值。
4.如权利要求3所述的方法，其特征在于，所述根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项，包括：
绘制文档对象模型节点；
根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的菜单项图标生成图标节点；
将生成的文本节点和/或图标节点构成自定义菜单项。
5.如权利要求3所述的方法，其特征在于，所述根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项，包括：
绘制文档对象模型节点；
根据配置信息中所指示的菜单项文本和/或菜单项图标，并根据所述文档对象模型节点，生成自定义菜单项；
在所述文档对象模型节点中增加子菜单节点，以指示所述生成的自定义菜单项包括子菜单；
根据配置信息中所指示的子菜单项文本和/或子菜单项图标，生成对应的各子菜单项，得到子菜单；
将所述子菜单与所述生成的自定义菜单项关联。
6.如权利要求4或5所述的方法，其特征在于，还包括：
在检测到鼠标进入事件时，若所述鼠标进入事件关联的自定义菜单项包括子菜单，则进一步显示生成的子菜单项；
在检测到鼠标离开事件时，将显示的子菜单项隐藏，并在检测到点击操作时，隐藏所述显示的自定义菜单。
7.如权利要求6所述的方法，其特征在于，所述根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单，还包括：
禁止将对所述得到的自定义菜单上的鼠标操作事件冒泡给该自定义菜单所属的父节点，所述鼠标操作事件包括鼠标弹起事件、鼠标按下事件、鼠标点击事件中的任一种或多种。
8.如权利要求7所述的方法，其特征在于，所述显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单之前，还包括：
构造自定义菜单边框的装饰性节点，以便于在所述显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。
9.一种在网页中实现自定义菜单显示的装置，其特征在于，包括：
生成模块，用于在监测到右键点击操作事件时，若确定显示自定义菜单，则根据鼠标光标当前所处位置的页面元素生成配置信息；
获取模块，用于根据配置信息生成自定义菜单项以及菜单节点，将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
显示模块，用于显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单。
10.如权利要求9所述的装置，其特征在于，所述生成模块包括：
判断单元，用于在监测到右键点击操作事件时，判断鼠标光标当前所处位置是否位于需要显示自定义菜单的页面元素的位置；
生成单元，用于所述判断单元的判断结果为是时，则确定显示自定义菜单，根据鼠标光标当前所处位置的页面元素生成配置信息。
11.如权利要求10所述的装置，其特征在于，所述获取模块包括：
菜单项生成单元，用于根据配置信息中所指示的菜单项文本和/或菜单项图标，生成对应的自定义菜单项；
菜单生成单元，用于将生成的自定义菜单项添加到所述菜单节点中，得到添加了根据配置信息生成的所有自定义菜单项的自定义菜单；
其中，所述自定义菜单的宽度值为生成的自定义菜单项中宽度的最大值。
12.如权利要求11所述的装置，其特征在于，所述菜单项生成单元包括：
第一绘制子单元，用于绘制文档对象模型节点；
第一生成子单元，用于根据文档对象模型节点与配置信息中所指示的菜单项文本生成文本节点，和/或根据文档对象模型节点与配置信息中所指示的菜单项图标生成图标节点；
第一构造子单元，用于将生成的文本节点和/或图标节点构成自定义菜单项。
13.如权利要求11所述的装置，其特征在于，所述菜单项生成单元包括：
第二绘制子单元，用于绘制文档对象模型节点；
第二生成子单元，用于根据配置信息中所指示的菜单项文本和/或图标，并根据所述文档对象模型节点，生成菜单项；
节点生成子单元，用于在所述文档对象模型节点中增加子菜单节点，以指示所述生成的自定义菜单项包括子菜单；
第三生成子单元，用于根据配置信息中所指示的子菜单项文本和/或子菜单项图标，生成对应的各子菜单项，得到子菜单；
关联子单元，用于将所述子菜单与所述生成的自定义菜单项关联。
14.如权利要求12或13所述的装置，其特征在于，还包括：
子菜单显示模块，用于在检测到鼠标进入事件时，若所述鼠标进入事件关联的自定义菜单项包括子菜单，则进一步显示生成的子菜单项；
隐藏模块，用于在检测到鼠标离开事件时，将显示的子菜单项隐藏，并在检测到点击操作时，隐藏所述显示的自定义菜单。
15.如权利要求14所述的装置，其特征在于，还包括：
屏蔽模块，用于禁止将对所述得到的自定义菜单上的鼠标操作事件冒泡给该自定义菜单所属的父节点，所述鼠标操作事件包括鼠标弹起事件、鼠标按下事件、鼠标点击事件中的任一种或多种。
16.如权利要求15所述的装置，其特征在于，还包括：
构造模块，用于构造自定义菜单边框的装饰性节点，以便于在所述显示模块显示所述添加了根据配置信息生成的所有自定义菜单项的自定义菜单中包括所述装饰性节点。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201210568532.6A CN103902258A (zh) | 2012-12-25 | 2012-12-25 | 一种在网页中实现自定义菜单显示的方法及装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201210568532.6A CN103902258A (zh) | 2012-12-25 | 2012-12-25 | 一种在网页中实现自定义菜单显示的方法及装置 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN103902258A true CN103902258A (zh) | 2014-07-02 |
Family
ID=50993604
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201210568532.6A Pending CN103902258A (zh) | 2012-12-25 | 2012-12-25 | 一种在网页中实现自定义菜单显示的方法及装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN103902258A (zh) |
Cited By (12)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105426058A (zh) * | 2015-11-03 | 2016-03-23 | 上海斐讯数据通信技术有限公司 | 支持菜单栏自定义设定的***及菜单栏自定义设定的方法 |
| CN106095255A (zh) * | 2016-06-20 | 2016-11-09 | 武汉斗鱼网络科技有限公司 | 一种下拉菜单显示控制方法及装置 |
| CN106293350A (zh) * | 2015-05-18 | 2017-01-04 | 阿里巴巴集团控股有限公司 | 快捷获取信息的方法和装置 |
| CN106815023A (zh) * | 2017-01-09 | 2017-06-09 | 山东华软金盾软件股份有限公司 | 一种接管windows***开始菜单的方法 |
| CN107422945A (zh) * | 2016-05-24 | 2017-12-01 | 阿里巴巴集团控股有限公司 | 界面信息交互方法、装置以及电子终端 |
| CN108228036A (zh) * | 2016-12-09 | 2018-06-29 | 武汉斗鱼网络科技有限公司 | 一种windows中窗口菜单的实现方法及装置 |
| CN109189291A (zh) * | 2018-07-26 | 2019-01-11 | 新华三大数据技术有限公司 | 菜单管理方法及装置 |
| CN109343763A (zh) * | 2018-09-03 | 2019-02-15 | 沈阳工业大学 | 智能多边形右键菜单方法 |
| CN110020337A (zh) * | 2017-08-03 | 2019-07-16 | 腾讯科技（深圳）有限公司 | 网页处理方法及相关产品 |
| CN111104109A (zh) * | 2018-10-29 | 2020-05-05 | 北京数聚鑫云信息技术有限公司 | 一种web页面上的右键菜单的处理方法、***、介质和计算机设备 |
| CN114528811A (zh) * | 2022-01-21 | 2022-05-24 | 北京麦克斯泰科技有限公司 | 文章内容抽取方法、装置、设备及存储介质 |
| CN116010015A (zh) * | 2023-03-27 | 2023-04-25 | 西安热工研究院有限公司 | 监控画面右键菜单生成方法、装置、设备和存储介质 |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101071361A (zh) * | 2007-05-31 | 2007-11-14 | 腾讯科技（深圳）有限公司 | 一种自定义右键菜单的方法及*** |
| CN101833576A (zh) * | 2010-04-23 | 2010-09-15 | 广州联炬科技企业孵化器有限公司 | 一种添加网站快捷导航菜单的方法 |
| US8473843B2 (en) * | 2008-03-28 | 2013-06-25 | Sprint Communications Company L.P. | Correcting data inputted into a mobile communications device |
-
2012
- 2012-12-25 CN CN201210568532.6A patent/CN103902258A/zh active Pending
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101071361A (zh) * | 2007-05-31 | 2007-11-14 | 腾讯科技（深圳）有限公司 | 一种自定义右键菜单的方法及*** |
| US8473843B2 (en) * | 2008-03-28 | 2013-06-25 | Sprint Communications Company L.P. | Correcting data inputted into a mobile communications device |
| CN101833576A (zh) * | 2010-04-23 | 2010-09-15 | 广州联炬科技企业孵化器有限公司 | 一种添加网站快捷导航菜单的方法 |
Cited By (16)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106293350A (zh) * | 2015-05-18 | 2017-01-04 | 阿里巴巴集团控股有限公司 | 快捷获取信息的方法和装置 |
| CN105426058A (zh) * | 2015-11-03 | 2016-03-23 | 上海斐讯数据通信技术有限公司 | 支持菜单栏自定义设定的***及菜单栏自定义设定的方法 |
| CN107422945A (zh) * | 2016-05-24 | 2017-12-01 | 阿里巴巴集团控股有限公司 | 界面信息交互方法、装置以及电子终端 |
| CN106095255A (zh) * | 2016-06-20 | 2016-11-09 | 武汉斗鱼网络科技有限公司 | 一种下拉菜单显示控制方法及装置 |
| CN108228036A (zh) * | 2016-12-09 | 2018-06-29 | 武汉斗鱼网络科技有限公司 | 一种windows中窗口菜单的实现方法及装置 |
| CN108228036B (zh) * | 2016-12-09 | 2021-03-12 | 武汉斗鱼网络科技有限公司 | 一种windows中窗口菜单的实现方法及装置 |
| CN106815023A (zh) * | 2017-01-09 | 2017-06-09 | 山东华软金盾软件股份有限公司 | 一种接管windows***开始菜单的方法 |
| CN106815023B (zh) * | 2017-01-09 | 2020-05-05 | 山东华软金盾软件股份有限公司 | 一种接管windows***开始菜单的方法 |
| CN110020337A (zh) * | 2017-08-03 | 2019-07-16 | 腾讯科技（深圳）有限公司 | 网页处理方法及相关产品 |
| CN110020337B (zh) * | 2017-08-03 | 2022-10-28 | 腾讯科技（深圳）有限公司 | 网页处理方法及相关产品 |
| CN109189291A (zh) * | 2018-07-26 | 2019-01-11 | 新华三大数据技术有限公司 | 菜单管理方法及装置 |
| CN109343763A (zh) * | 2018-09-03 | 2019-02-15 | 沈阳工业大学 | 智能多边形右键菜单方法 |
| CN111104109A (zh) * | 2018-10-29 | 2020-05-05 | 北京数聚鑫云信息技术有限公司 | 一种web页面上的右键菜单的处理方法、***、介质和计算机设备 |
| CN114528811A (zh) * | 2022-01-21 | 2022-05-24 | 北京麦克斯泰科技有限公司 | 文章内容抽取方法、装置、设备及存储介质 |
| CN114528811B (zh) * | 2022-01-21 | 2022-09-02 | 北京麦克斯泰科技有限公司 | 文章内容抽取方法、装置、设备及存储介质 |
| CN116010015A (zh) * | 2023-03-27 | 2023-04-25 | 西安热工研究院有限公司 | 监控画面右键菜单生成方法、装置、设备和存储介质 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN103902258A (zh) | 一种在网页中实现自定义菜单显示的方法及装置 | |
| US7844917B2 (en) | Optimal display of multiple windows within a computer display | |
| KR101890461B1 (ko) | 코멘트에 대한 액세스의 결정 | |
| US20140089824A1 (en) | Systems And Methods For Dynamically Altering A User Interface Based On User Interface Actions | |
| US9026992B2 (en) | Folded views in development environment | |
| US8893050B2 (en) | Assembly and output of user-defined groupings | |
| CN107291347B (zh) | 一种信息显示方法及装置 | |
| CN111061419B (zh) | 一种应用栏显示方法及电子设备 | |
| KR101512010B1 (ko) | 셸 애플리케이션들 및 서브애플리케이션들의 인터페이스들의 조합 | |
| WO2019223280A1 (zh) | 智能交互平板的操作方法、装置以及智能交互平板 | |
| CN111381920B (zh) | 弹窗组件的显示方法、装置以及电子终端 | |
| CN107181858A (zh) | 一种显示通知消息的方法及终端 | |
| TW201617839A (zh) | 光解離管理器 | |
| US20190026385A1 (en) | Overlay canvas for computer program applications | |
| CN105229606A (zh) | 基于内容的定向放置应用启动 | |
| US20160231876A1 (en) | Graphical interaction in a touch screen user interface | |
| CN113918260A (zh) | 应用程序显示方法、装置及电子设备 | |
| CN104216646A (zh) | 基于手势创建应用程序的方法及装置 | |
| EP3364637B1 (en) | Method and apparatus for filtering object by means of pressure | |
| US8719704B2 (en) | Seamless integration of additional functionality into enterprise software without customization or apparent alteration of same | |
| CN105320405A (zh) | 一种图标显示方法及终端 | |
| EP2849058A1 (en) | Method and device for displaying a message associated with an application | |
| CN111198830B (zh) | 移动存储设备的识别方法、装置、电子设备以及存储介质 | |
| CN112433723B (zh) | 个性化列表开发方法及装置 | |
| CN109492249A (zh) | 设计图的快速生成方法、装置及终端设备 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20140702 |