CN109783750A - 事件机制定义网页交互行为的方法、装置及电子设备 - Google Patents
事件机制定义网页交互行为的方法、装置及电子设备 Download PDFInfo
- Publication number
- CN109783750A CN109783750A CN201811526895.7A CN201811526895A CN109783750A CN 109783750 A CN109783750 A CN 109783750A CN 201811526895 A CN201811526895 A CN 201811526895A CN 109783750 A CN109783750 A CN 109783750A
- Authority
- CN
- China
- Prior art keywords
- event
- webpage
- web page
- trigger action
- functions
- 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
Abstract
本发明实施例公开了一种事件机制定义网页交互行为的方法、装置及电子设备。其中的方法包括:在给定的网页制作界面内,获取被选择的网页元素;获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;获取针对所述事件函数所包括的参数的赋值并存储;其中,所述事件函数和所述参数的赋值用于:若网页元素在网页浏览中被触发,则所述事件函数及所述事件函数中的参数值被解析,实现基于事件的网页交互。本发明。本发明能够实现事件灵活绑定,无需人工手动开发或修改代码来响应事件,节约开发时间,提高开发效率。并且,事件的响应函数能够在不同的网页制作开发过程中实现代码共享,具有通用性。
Description
技术领域
本发明涉及网页前端技术领域,尤其涉及一种事件机制定义网页交互行为的方法、装置及电子设备。
背景技术
通常情况下,若网页中的元素关联某一事件,则,该元素被触发时,所关联的事件在代码层面所对应的响应,是JavaScript的函数。换句话说,这意味着,在开发网页的过程中,若要实现事件关联功能,网页开发人员需要手动编写JavaScript函数对应的代码。通过函数的调用,实现对某元素被触发时其关联事件的响应。
从上述原理的描述可以看出,需要为元素被触发所引发的事件进行人工手动代码编写。在一些情境下,这是正当且必须的。但在另一些情境下,比如,一些没有软件开发能力的用户,借助于某些应用程序,自助(或,半自助)进行网页制作时,若想要为某一元素增加其被触发时产生的事件响应的功能,就变得比较困难了。
发明内容
有鉴于此,本发明实施例提供了一种事件机制定义网页交互行为的方法、装置及电子设备,至少部分的解决现有技术中存在的问题。
第一方面,本发明实施例提供了一种事件机制定义网页交互行为的方法,用于网页制作,包括:
在给定的网页制作界面内,获取被选择的网页元素;
获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
获取针对所述事件函数所包括的参数的赋值并存储;其中
所述事件函数和所述参数的赋值用于:若为网页元素定制的事件在网页浏览中被触发,则所述事件函数及所述事件函数中的参数值被解析,实现基于事件的网页交互。
根据本发明实施例的一种具体实现方式,所述网页制作界面包括网页元素的选择区域,网页制作区域,以及,控制面板区域。
根据本发明实施例的一种具体实现方式,所述控制面板区域包括:
属性及样式查看编辑区;
触发操作类型选择区;以及
事件函数类型选择区;以及
事件函数的参数值赋值区。
根据本发明实施例的一种具体实现方式,所述触发操作类型包括:单击触发、双击触发、长按触发、按键触发或手指滑动触发。
根据本发明实施例的一种具体实现方式,所述触发操作选择区为下拉框,所述下拉框中预先设置有不同的触发操作类型供选择。
根据本发明实施例的一种具体实现方式,所述事件触发操作的响应通过JavaScript预先绑定。
第二方面,本发明实施例还提供了一种事件机制定义网页交互行为的装置,用于网页制作,包括:
元素选择模块,用于在给定的网页制作界面内,获取被选择的网页元素;
触发操作添加模块,用于添加为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
赋值模块,用于获取针对所述事件函数所包括的参数的赋值并存储;其中
所述事件函数和所述参数的赋值用于:若为网页元素定制的事件在网页浏览中被触发,则所述事件函数及所述事件函数中的参数值被解析,实现基于事件的网页交互。
第三方面,本发明实施例还提供了一种事件机制定义网页交互行为的方法,包括如下步骤:
接收网页浏览用户针对浏览器可视界面中网页元素的触发操作;
获取所述触发操作所预先绑定的事件;
解析所述事件所对应的事件函数及其包含的参数值;
根据所述事件函数及所述参数值进行网页交互;
其中,所述触发操作所绑定的事件通过如下步骤添加至元素:
在给定的网页制作界面内,获取被选择的网页元素;
获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
获取针对所述事件函数所包括的参数的赋值并存储。
根据本发明实施例的一种具体实现方式,所述网页制作界面包括网页元素的选择区域,网页制作区域,以及,控制面板区域。
根据本发明实施例的一种具体实现方式,所述控制面板区域包括:
属性及样式查看编辑区;
触发操作类型选择区;以及
事件函数类型选择区;以及
事件函数的参数值赋值区。
根据本发明实施例的一种具体实现方式,所述触发操作类型包括:所述触发操作类型包括:点击、双击、长按、长按、按键触发或手指滑动。
根据本发明实施例的一种具体实现方式,所述触发操作选择区为下拉框,所述下拉框中预先设置有不同的触发操作类型供选择。
根据本发明实施例的一种具体实现方式,所述事件触发操作的响应通过JavaScript预先绑定。
第四方面,本发明实施例还提供了一种事件机制定义网页交互行为的装置,包括:
触发操作检测模块,用于接收网页浏览用户针对浏览器可视界面中网页元素的触发操作;
事件绑定查询模块,用于获取所述触发操作所预先绑定的事件;
解析模块,用于解析所述事件所对应的事件函数及其包含的参数值;
交互模块,用于根据所述事件函数及所述参数值进行网页交互;
其中,所述事件绑定查询模块还连接有事件绑定模块,该事件绑定模块还包括:
元素选择单元,用于在给定的网页制作界面内,获取被选择的网页元素;
触发操作添加单元,用于获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
赋值单元,用于获取针对所述事件函数所包括的参数的赋值并存储。
第五方面,本发明实施例还提供了一种电子设备,该电子设备包括:
至少一个处理器;以及,
与该至少一个处理器通信连接的存储器;其中,
该存储器存储有可被该至少一个处理器执行的指令,该指令被该至少一个处理器执行,以使该至少一个处理器能够执行前述任第一方面或第一方面的任一实现方式中的事件机制定义网页交互行为的方法;以及,执行前述任第三方面或第撒方面的任一实现方式中的事件机制定义网页交互行为的方法。
第六方面,本发明实施例还提供了一种非暂态计算机可读存储介质,该非暂态计算机可读存储介质存储计算机指令,该计算机指令用于使该计算机执行前述第一方面或第一方面的任一实现方式中的事件机制定义网页交互行为的方法;以及,执行前述任第三方面或第撒方面的任一实现方式中的事件机制定义网页交互行为的方法。
第七方面,本发明实施例还提供了一种计算机程序产品,该计算机程序产品包括存储在非暂态计算机可读存储介质上的计算程序,该计算机程序包括程序指令,当该程序指令被计算机执行时,使该计算机执行前述第一方面或第一方面的任一实现方式中的事件机制定义网页交互行为的方法;以及,执行前述任第三方面或第撒方面的任一实现方式中的事件机制定义网页交互行为的方法。
本发明实施例提供的事件机制定义网页交互行为的方法、装置及电子设备、非暂态计算机可读存储介质及计算机程序中:网页元素预先绑定关联的事件,在应用程序被使用时,网页元素可以按照预定的操作被触发,进而,网页元素所关联的事件通过事件函数的调用被响应。网页制作的应用程序的开发人员,通过这种方式将特定元素的关联事件(包括该关联事件对应的函数)写入网页制作工具中,这样,使用该应用程序来制作网页的用户就可以为网页元素选择绑定事件的触发方式,由于事件的响应函数是由网页制作应用程序开发人员预先写好的,因此,制作网页的用户无需在代码层面写事件对应的函数,只需要为函数中的相关参数进行个性化的赋值。
通过上述分析可以看出,本发明实施例具有如下技术效果:
第一、能够实现元素与事件的灵活绑定;
第二、对于使用应用程序来制作网页的用户来说,若要实现元素具有事件的属性,无需人工手动开发或修改代码来响应事件,故,降低网页制作的难度,节约开发时间,提高网页制作的效率。
第三、事件的响应函数能够应用在不同的网页制作过程中,不同的网页制作过程中,事件代码共享,具有很好的通用性。
附图说明
为了更清楚地说明本发明实施例的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其它的附图。
图1为本发明实施例提供的一种事件机制定义网页交互行为的方法的步骤流程图;
图2为本发明实施例提供的一种事件机制定义网页交互行为的方法中,网页制作界面的示意图;
图3为本发明实施例提供的一种事件机制定义网页交互行为的方法中,控制面板区域C的样式图;
图4为本发明另一实施例提供的一种事件机制定义网页交互行为的方法的步骤流程图;
图5为本发明实施例提供的件机制定义网页交互行为的装置的结构框图;
图6为本发明另一实施例提供的件机制定义网页交互行为的装置的结构框图;
图7为本发明实施例提供的电子设备的结构框图。
具体实施方式
下面结合附图对本发明实施例进行详细描述。
以下通过特定的具体实例说明本公开的实施方式,本领域技术人员可由本说明书所揭露的内容轻易地了解本公开的其他优点与功效。显然,所描述的实施例仅仅是本公开一部分实施例,而不是全部的实施例。本公开还可以通过另外不同的具体实施方式加以实施或应用,本说明书中的各项细节也可以基于不同观点与应用,在没有背离本公开的精神下进行各种修饰或改变。需说明的是,在不冲突的情况下,以下实施例及实施例中的特征可以相互组合。基于本公开中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本公开保护的范围。
需要说明的是,下文描述在所附权利要求书的范围内的实施例的各种方面。应显而易见,本文中所描述的方面可体现于广泛多种形式中,且本文中所描述的任何特定结构及/或功能仅为说明性的。基于本公开,所属领域的技术人员应了解,本文中所描述的一个方面可与任何其它方面独立地实施,且可以各种方式组合这些方面中的两者或两者以上。举例来说,可使用本文中所阐述的任何数目个方面来实施设备及/或实践方法。另外,可使用除了本文中所阐述的方面中的一或多者之外的其它结构及/或功能性实施此设备及/或实践此方法。
还需要说明的是,以下实施例中所提供的图示仅以示意方式说明本公开的基本构想,图式中仅显示与本公开中有关的组件而非按照实际实施时的组件数目、形状及尺寸绘制,其实际实施时各组件的型态、数量及比例可为一种随意的改变,且其组件布局型态也可能更为复杂。
另外,在以下描述中,提供具体细节是为了便于透彻理解实例。然而,所属领域的技术人员将理解,可在没有这些特定细节的情况下实践所述方面。
本公开实施例提供一种事件机制定义网页交互行为的方法。本实施例提供的事件机制定义网页交互行为的方法可以由一计算装置来执行,该计算装置可以实现为软件,或者实现为软件和硬件的组合,该计算装置可以集成设置在服务器、终端设备等中。
首先,对本发明实施例事件机制定义网页交互行为的方法的使用情境进行说明。
目前,在用户终端,尤其是移动终端上,网页的构建方式通常为,客户提出网页呈现效果和功能,开发人员根据客户需求,以代码的方式,实现网页的UI设计及所需功能。比如,在一个通常的构建中,开发人员通过选择所需组件,并拖拽形成网页UI,然后,编写实现功能的代码。其中,被拖拽的组件还需进行进一步渲染及组合以实现所需效果。
尤其是,若网页中的元素关联某一事件,则,该元素被触发时,所关联的事件在代码层面所对应的响应,是JavaScript的函数。换句话说,这意味着,在开发网页的过程中,若要实现事件关联功能,网页开发人员需要手动编写JavaScript函数对应的代码。通过函数的调用,实现对某元素被触发时其关联事件的响应。也就是说,没有软件开发能力的用户,借助于某些应用程序,自助(或,半自助)进行网页制作时,若想要为某一元素增加其被触发时产生的事件响应的功能,就变得比较困难了
针对这种情况,本发明实施例,帮助用户自助,或半自助的开发网页的应用程序应运而生。其功能为,由应用程序的开发人员开发一个网页制作工具,比如,安装在手机移动终端的一个APP,当用户使用这个APP时,仅需简单的选择、拖拽、编辑网页元素属性、样式、绑定关联事件的方式,就可以相对轻松的按照自己的意愿设计网页,按照自己的意愿实现浏览网页的用户与网页的行为交互。
通过上述说明,可以看出,本发明的实施例涉及三类“人”:
第一类:应用程序开发人员,其进行应用程序的开发,形成网页制作的工具,如,一个APP,或者电脑中的一个EXE文件,在移动终端或者电脑中被下载后被安装。
第二类:制作网页的人,其下载第一类人开发形成的应用程序或者文件,例如APP,安装在本地的移动终端或电脑。在制作网页时,打开这个APP,基于提供的界面和相关的工具,按照个人的意愿,个性化地设计网页。
因为网页制作代码层面技术已经被上述“第一类人”,也就是应用程序的开发人员封装起来,呈现给网页制作人员的界面是非常友好的,通过选择拖拽所需的网络元素,并为该网络元素的基本属性、样式、绑定事件等信息进行个性化约束,即可生成自己所需的网页。
第三类:浏览网页的人。对于这些用户来说,并不涉及网页是如何制作的。其看到网页中元素的属性,样式,对于某些绑定的事件功能的元素,可以进行交互。
简单地说,本发明实施例是在说明一个网页,是如何通过作为应用程序开发人员的“第一类人”和作为网页制作的“第二类人”构建的,以及,应用程序开发人员做了什么,使得网页制作人员的网页制作变得容易又有效率。
参照图1,图1为本发明实施例提供的一种事件机制定义网页交互行为的方法的步骤流程图。该实施例用于网页制作,包括如下步骤:
S101,在给定的网页制作界面内,获取网页制作人员所选择的网页元素。
在一个实施例中,网页制作界面可以参照图2所示。从图2可以看出,网页制作界面包括网页元素的选择区域A,网页制作区域B,以及,控制面板区域C。
下面分别对上述三个区域进行说明。
1)网页元素选择区域A
在这个区域中,列出了制作网页可能用到的各种元素,例如,按钮、超链接、图片、声音、视频、下拉列表、表格、表单、输入框等等。
上述元素呈现在元素选择区域A中,供制作网页的用户根据需要进行选择。
2)网页制作区域B
制作网页的用户根据需要,选择某一网页元素后,将其拖至该网页制作区域B中。此时,控制面板区域C将出现于该网页元素对应的信息。
3)控制面板区域C
参照图3,图3示出了在本发明一个实施例中,控制面板区域C的样式图。
在一个实施例中,控制面板区域C包括属性及样式查看编辑区C1。对于某些关联了事件的网页元素,控制面板区域C还会包括触发操作类型选择区C2;以及,事件函数类型选择区C3、事件函数的参数值赋值区C4等。
下面,对控制面板区域中的各个区进行说明。
1)属性及样式查看编辑区C1
当选定某个网页元素后,通过控制面板区域中的属性及样式查看编辑区域C1来约束网页元素。例如,当选定的网页元素为图片时,则需在在C1区设定其属性和样式,比如,图片的长、图片的高,图片的背景颜色等参数。若选择的元素是一段音乐,则在该区域还会给出该音乐的存放地址。
2)触发操作类型选择区C2
事件是可以被侦测到的行为。通过设定,网页中的每个元素都可以产生某些可以触发函数或程序的事件,比如,触发JavaScript的函数或程序的事件。
在一个优选的实施例中,触发操作类型可以根据用户终端的不同进行设定,比如,用户终端为PC电脑,则触发操作类型可以为鼠标单击触发、鼠标双击触发、鼠标长按触发、PC键盘的按键触发;若用户终端为手机,则触发操作类型可以为,手指单击触发、手指双击触发、手指长按屏幕触发、手机滑动触发等。当然,也可以包括其他触发形式的操作。本发明在此不做限定。
操作类型的选择可以通过下拉框选择实现。例如,将不同的触发操作预先放置在下拉框中,网页制作的用户通过点击下拉框选择触发操作。
3)事件函数类型选择区C3
该选择区提供各种事件的函数类型供选择,例如,打电话的函数类型、发邮件的函数类型、发短信的函数类型等。
4)事件函数的参数值赋值区C4
元素被触发后,会调用对应的函数,解析函数中的参数值,实现触发响应。函数中的各个参数的具体赋值,在本发明的实施例中,可以通过网页制作人员来个性化设置。
举例来说,若在网页元素选择区域A中选择的是打电话的图片G,将其拖到网页制作区域B中,此时控制面板区域C可以编辑或选择:
i)属性及样式查看编辑区C1:
图片G的高度:
图片G的宽度:
图片G的背景颜色:
ii)触发操作类型选择区C2
出现下拉框,用户可以通过下拉框,选择“点击”的触发方式
iii)事件函数类型选择区C3
例如,在该实施例中,函数类型选择为打电话
ⅳ)事件函数的参数值赋值区C4
在对话框中填写联系电话,比如,4001234567。
S102,获取为网页元素所定制的事件触发操作;并且,事件触发操作的响应通过事件函数预先绑定。
如上所述,通过控制面板区域中的触发操作类型选择区C2就可以获取为网页元素所定制的事件触发操作。
事件触发操作的响应通过事件函数预先绑定,也就是说,上述的第一类人,应用程序开发人员要将事件函数预先写入JavaScript语言中,在一个实施例中,可以通过JavaScript预先绑定。
S103,获取针对事件函数所包括的参数的赋值并存储。
为了实现个性化设计,通常,在开发过程中,对于事件函数中的参数值是不做限定的,在网页制作人员打开这个工具后,需要选定事件触发方式、以及给定事件函数中具体参数的参数值,二者结合起来,就可以响应网页制作用户的事件关联功能了。也就是说,事件函数和参数的赋值用于:若网页元素在网页浏览中被触发,则事件函数及事件函数中的参数值被解析,实现基于事件的网页交互。
图4为本发明实施例提供的一种事件机制定义网页交互行为的方法的步骤流程图。包括如下步骤:
S401,接收网页浏览用户针对浏览器可视界面中网页元素的触发操作。
网页浏览用户打开网页后,若需要进一步发生交互,比如,通过点击网页中的某图片,实现打电话或者发邮件的功能,则会通过特定的触发方式,进行事件触发。
网页制作人员以及应用程序的开发人员通过合作完成的网页中,会以某种形式的提示或暗示表明触发形式。比如,图片的闪烁。
S402,获取触发操作所预先绑定的事件。
如上所述,由于触发操作与所绑定的事件已经进行了绑定,当触发发生时,触发操作所对应的事件就可以确定。
S403,解析事件所对应的事件函数及其包含的参数值。
为了对触发进行响应,对函数的调用时必须的,也包括函数中具体地参数值的解析。
S404,根据事件函数及所述参数值进行网页交互;
其中,所述触发操作所绑定的事件通过如下步骤添加至元素:
S4021,在给定的网页制作界面内,获取被选择的网页元素;
S4022,获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
S4023,获取针对所述事件函数所包括的参数的赋值并存储。
上述S4021~S4023即是图1所示的实施例中详细说明的内容,本实施例在此不再赘述。
本实施例是在浏览网页的用户打开网页后,通过接收触发相关网页元素的信号,实现基于关联事件的网页-用户交互行为的过程。
而图1所示的实施例,是制作网页的用户打开制作界面后,基于开发网页的用户所开发的程序而进行的网页制作的过程。
简单地说,基于本发明的实施例,在软件开发人员开发应用程序时,对网页中的某个元素,利用元素控制面板,对事件(例如,click,drag,tap)进行绑定。元素控制面板用于查看和编辑元素基本属性和样式,并通过选择的方式(比如下拉的方式)关联特定事件。当某元素所绑定的事件被触发时,将调用页面内预先定制的javascript函数,事件以及与事件绑定的javascript函数是由应用程序开发方进行关联的。
预先存储的javascript函数有应用程序开发人员提供,函数中具体参数的具体值由网页制作方提供,并被javascript函数调用。
通过上述分析可以看出,本发明实施例具有如下技术效果:
第一、能够实现元素与事件的灵活绑定;
第二、对于使用应用程序来制作网页的用户来说,若要实现元素具有事件的属性,无需人工手动开发或修改代码来响应事件,故,降低网页制作的难度,节约开发时间,提高网页制作的效率。
第三、事件的响应函数能够应用在不同的网页制作过程中,不同的网页制作过程中,事件代码共享,具有很好的通用性。
另一方面,本发明还提供了一种事件机制定义网页交互行为的装置50,用于网页制作,参照图5,包括:
元素选择模501,用于在给定的网页制作界面内,获取被选择的网页元素。
在一个实施例中,网页制作界面可以参照图2所示。从图2可以看出,网页制作界面包括网页元素的选择区域A,网页制作区域B,以及,控制面板区域C。
下面分别对上述三个区域进行说明。
1)网页元素选择区域A
在这个区域中,列出了制作网页可能用到的各种元素,例如,按钮、超链接、图片、声音、视频、下拉列表、表格、表单、输入框等等。
上述元素呈现在元素选择区域A中,供制作网页的用户根据需要进行选择。
2)网页制作区域B
制作网页的用户根据需要,选择某一网页元素后,将其拖至该网页制作区域B中。此时,控制面板区域C将出现于该网页元素对应的信息。
3)控制面板区域C
参照图3,图3示出了在本发明一个实施例中,控制面板区域C的样式图。
在一个实施例中,控制面板区域C包括属性及样式查看编辑区C1。对于某些关联了事件的网页元素,控制面板区域C还会包括触发操作类型选择区C2;以及,事件函数的参数值赋值区C3等。
下面,对控制面板区域中的各个区进行说明。
1)属性及样式查看编辑区C1
当选定某个网页元素后,通过控制面板区域中的属性及样式查看编辑区域C1来约束网页元素。例如,当选定的网页元素为图片时,则需在在C1区设定其属性和样式,比如,图片的长、图片的高,图片的背景颜色等参数。若选择的元素是一段音乐,则在该区域还会给出该音乐的存放地址。
2)触发操作类型选择区C2
事件是可以被侦测到的行为。通过设定,网页中的每个元素都可以产生某些可以触发函数或程序的事件,比如,触发JavaScript的函数或程序的事件。网页可能在PC上打开,也可能在手机上打开。所以触发类型多样。
在一个实施例中,触发操作类型可以根据用户终端的不同进行设定,比如,用户终端为PC电脑,则触发操作类型可以为鼠标单击触发、鼠标双击触发、鼠标长按触发、PC键盘的按键触发;若用户终端为手机,则触发操作类型可以为,手指单击触发、手指双击触发、手指长按屏幕触发、手机滑动触发等。可以包括点击、双击或鼠标长按。当然,也可以包括其他触发形式的操作。本发明在此不做限定。
操作类型的选择可以通过下拉框选择实现。例如,将不同的触发操作预先放置在下拉框中,网页制作的用户通过点击下拉框选择触发操作。
3、事件函数类型选择区C3
该选择区提供各种事件的函数类型供选择,例如,打电话的函数类型、发邮件的函数类型、发短信的函数类型等。
4)事件函数的参数值赋值区C4
元素被触发后,会调用对应的函数,解析函数中的参数值,实现触发响应。函数中的各个参数的具体赋值,在本发明的实施例中,可以通过网页制作人员来个性化设置。
举例来说,若在网页元素选择区域A中选择的是打电话的图片G,将其拖到网页制作区域B中,此时控制面板区域C可以编辑或选择:
i)属性及样式查看编辑区C1:
图片G的高度:
图片G的宽度:
图片G的背景颜色:
ii)触发操作类型选择区C2
出现下拉框,用户可以通过下拉框,选择“点击”的触发方式
iii)事件函数类型选择区C3
比如,打电话
ⅳ)事件函数的参数值赋值区C4
在对话框中填写联系电话,比如,4001234567。
触发操作添加模块502,用于添加为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定。
如上所述,通过控制面板区域中的触发操作类型选择区C2就可以获取为网页元素所定制的事件触发操作。
事件触发操作的响应通过事件函数预先绑定,也就是说,上述的第一类人,应用程序开发人员要将事件函数预先写入html语言中,在一个实施例中,可以通过JavaScript预先绑定。
赋值模块503,用于获取针对所述事件函数所包括的参数的赋值并存储。其中,所述事件函数和所述参数的赋值用于:若网页元素在网页浏览中被触发,则所述事件函数及所述事件函数中的参数值被解析,实现基于事件的网页交互。
图6为本发明另一实施例提供的件机制定义网页交互行为的装置60的结构框图,包括:
触发操作检测模块601,用于接收网页浏览用户针对浏览器可视界面中网页元素的触发操作;
事件绑定查询模块602,用于获取所述触发操作所预先绑定的事件;
解析模块603,用于解析所述事件所对应的事件函数及其包含的参数值;
交互模块604,用于根据所述事件函数及所述参数值进行网页交互;
其中,所述事件绑定查询模块602还连接有事件绑定模块605,该事件绑定模块605还包括:
元素选择单元6051,用于在给定的网页制作界面内,获取被选择的网页元素;
触发操作添加单元6052,用于获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
赋值单元6053,用于获取针对所述事件函数所包括的参数的赋值并存储。
需要说明的是,上述实施例事件机制定义网页交互行为的装置与方法实施例原理相似,相关之处参照上述说明即可,本发明在此不再赘述。
上述装置实施例中,网页元素预先绑定关联的事件,在应用程序被使用时,网页元素可以按照预定的操作被触发,进而,网页元素所关联的事件通过事件函数的调用被响应。网页制作的应用程序的开发人员,通过这种方式将特定元素的关联事件(包括该关联事件对应的函数)写入网页制作工具中,这样,使用该应用程序来制作网页的用户就可以为网页元素选择绑定事件的触发方式,由于事件的响应函数是由网页制作应用程序开发人员预先写好的,因此,制作网页的用户无需在代码层面写事件对应的函数,只需要为函数中的相关参数进行个性化的赋值。
通过上述分析可以看出,本发明实施例具有如下技术效果:
第一、能够实现元素与事件的灵活绑定;
第二、对于使用应用程序来制作网页的用户来说,若要实现元素具有事件的属性,无需人工手动开发或修改代码来响应事件,故,降低网页制作的难度,节约开发时间,提高网页制作的效率。
第三、事件的响应函数能够应用在不同的网页制作过程中,不同的网页制作过程中,事件代码共享,具有很好的通用性。
图7示出了本发明实施例提供的电子设备70的结构示意图,电子设备70包括至少一个处理器701(例如CPU),至少一个输入输出接口704,存储器702,和至少一个通信总线703,用于实现这些部件之间的连接通信。至少一个处理器701用于执行存储器702中存储的计算机指令,以使所述至少一个处理器701能够执行前述任一方法的实施例。存储器702为非暂态存储器(non-transitory memory),其可以包含易失性存储器,例如高速随机存取存储器(RAM:Random Access Memory),也可以包括非易失性存储器(non-volatile memory),例如至少一个磁盘存储器。通过至少一个输入输出接口704(可以是有线或者无线通信接口)实现与至少一个其他设备或单元之间的通信连接。
在一些实施方式中,存储器702存储了程序7021,处理器701执行程序7021,用于执行前述任一方法实施例中的内容。
该电子设备可以以多种形式存在,包括但不限于:
(1)移动通信设备:这类设备的特点是具备移动通信功能,并且以提供话音、数据通信为主要目标。这类终端包括:智能手机(例如iPhone)、多媒体手机、功能性手机,以及低端手机等。
(2)超移动个人计算机设备:这类设备属于个人计算机的范畴,有计算和处理功能,一般也具备移动上网特性。这类终端包括:PDA、MID和UMPC设备等,例如iPad。
(3)便携式娱乐设备:这类设备可以显示和播放多媒体内容。该类设备包括:音频、视频播放器(例如iPod),掌上游戏机,电子书,以及智能玩具和便携式车载导航设备。
(4)特定服务器:提供计算服务的设备,服务器的构成包括处理器、硬盘、内存、系统总线等,服务器和通用的计算机架构类似,但是由于需要提供高可靠的服务,因此在处理能力、稳定性、可靠性、安全性、可扩展性、可管理性等方面要求较高。
(5)其他具有数据交互功能的电子设备。
需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
本说明书中的各个实施例均采用相关的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。
尤其,对于装置实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
在流程图中表示或在此以其他方式描述的逻辑和/或步骤,例如,可以被认为是用于实现逻辑功能的可执行指令的定序列表,可以具体实现在任何计算机可读介质中,以供指令执行系统、装置或设备(如基于计算机的系统、包括处理器的系统或其他可以从指令执行系统、装置或设备取指令并执行指令的系统)使用,或结合这些指令执行系统、装置或设备而使用。就本说明书而言,"计算机可读介质"可以是任何可以包含、存储、通信、传播或传输程序以供指令执行系统、装置或设备或结合这些指令执行系统、装置或设备而使用的装置。计算机可读介质的更具体的示例(非穷尽性列表)包括以下:具有一个或多个布线的电连接部(电子装置),便携式计算机盘盒(磁装置),随机存取存储器(RAM),只读存储器(ROM),可擦除可编辑只读存储器(EPROM或闪速存储器),光纤装置,以及便携式光盘只读存储器(CDROM)。另外,计算机可读介质甚至可以是可在其上打印所述程序的纸或其他合适的介质,因为可以例如通过对纸或其他介质进行光学扫描,接着进行编辑、解译或必要时以其他合适方式进行处理来以电子方式获得所述程序,然后将其存储在计算机存储器中。
应当理解,本发明的各部分可以用硬件、软件、固件或它们的组合来实现。
在上述实施方式中,多个步骤或方法可以用存储在存储器中且由合适的指令执行系统执行的软件或固件来实现。例如,如果用硬件来实现,和在另一实施方式中一样,可用本领域公知的下列技术中的任一项或他们的组合来实现:具有用于对数据信号实现逻辑功能的逻辑门电路的离散逻辑电路,具有合适的组合逻辑门电路的专用集成电路,可编程门阵列(PGA),现场可编程门阵列(FPGA)等。
以上所述,仅为本发明的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范围内,可轻易想到的变化或替换,都应涵盖在本发明的保护范围之内。因此,本发明的保护范围应以权利要求的保护范围为准。
Claims (13)
1.一种事件机制定义网页交互行为的方法,用于网页制作,其特征在于,包括:
在给定的网页制作界面内,获取被选择的网页元素;
获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
获取针对所述事件函数所包括的参数的赋值并存储;其中
所述事件函数和所述参数的赋值用于:若为网页元素定制的事件在网页浏览中被触发,则所述事件函数及所述事件函数中的参数值被解析,实现基于事件的网页交互。
2.根据权利要求1所述的方法,其特征在于,
所述网页制作界面包括网页元素的选择区域,网页制作区域,以及,控制面板区域。
3.根据权利要求2所述的方法,其特征在于,所述控制面板区域包括:
属性及样式查看编辑区;
触发操作类型选择区;
事件函数类型选择区;以及
事件函数的参数值赋值区。
4.根据权利要求3所述的方法,其特征在于,
所述触发操作类型包括:单击触发、双击触发、长按触发、按键触发或手指滑动触发。
5.根据权利要求4所述的方法,其特征在于,
所述触发操作选择区为下拉框,所述下拉框中预先设置有不同的触发操作类型供选择。
6.根据权利要求5所述的方法,其特征在于,
所述事件触发操作的响应通过JavaScript预先绑定。
7.一种事件机制定义网页交互行为的装置,用于网页制作,其特征在于,包括:
元素选择模块,用于在给定的网页制作界面内,获取被选择的网页元素;
触发操作添加模块,用于添加为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
赋值模块,用于获取针对所述事件函数所包括的参数的赋值并存储;其中
所述事件函数和所述参数的赋值用于:若为网页元素定制的事件在网页浏览中被触发,则所述事件函数及所述事件函数中的参数值被解析,实现基于事件的网页交互。
8.一种事件机制定义网页交互行为的方法,其特征在于,包括如下步骤:
接收网页浏览用户针对浏览器可视界面中网页元素的触发操作;
获取所述触发操作所预先绑定的事件;
解析所述事件所对应的事件函数及其包含的参数值;
根据所述事件函数及所述参数值进行网页交互;
其中,所述触发操作所绑定的事件通过如下步骤添加至元素:
在给定的网页制作界面内,获取被选择的网页元素;
获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
获取针对所述事件函数所包括的参数的赋值并存储。
9.一种事件机制定义网页交互行为的装置,其特征在于,包括:
触发操作检测模块,用于接收网页浏览用户针对浏览器可视界面中网页元素的触发操作;
事件绑定查询模块,用于获取所述触发操作所预先绑定的事件;
解析模块,用于解析所述事件所对应的事件函数及其包含的参数值;
交互模块,用于根据所述事件函数及所述参数值进行网页交互;
其中,所述事件绑定查询模块还连接有事件绑定模块,该事件绑定模块还包括:
元素选择单元,用于在给定的网页制作界面内,获取被选择的网页元素;
触发操作添加单元,用于获取为所述网页元素所定制的事件触发操作;并且,所述事件触发操作的响应通过事件函数预先绑定;
赋值单元,用于获取针对所述事件函数所包括的参数的赋值并存储。
10.一种电子设备,其特征在于,所述电子设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行前述任一权利要求1-6所述的事件机制定义网页交互行为的方法。
11.一种电子设备,其特征在于,所述电子设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行前述权利要求8所述的事件机制定义网页交互行为的方法。
12.一种非暂态计算机可读存储介质,该非暂态计算机可读存储介质存储计算机指令,该计算机指令用于使该计算机执行前述任一权利要求1-6所述的事件机制定义网页交互行为的方法。
13.一种非暂态计算机可读存储介质,该非暂态计算机可读存储介质存储计算机指令,该计算机指令用于使该计算机执行权利要求8所述的事件机制定义网页交互行为的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811526895.7A CN109783750A (zh) | 2018-12-13 | 2018-12-13 | 事件机制定义网页交互行为的方法、装置及电子设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811526895.7A CN109783750A (zh) | 2018-12-13 | 2018-12-13 | 事件机制定义网页交互行为的方法、装置及电子设备 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN109783750A true CN109783750A (zh) | 2019-05-21 |
Family
ID=66496192
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201811526895.7A Pending CN109783750A (zh) | 2018-12-13 | 2018-12-13 | 事件机制定义网页交互行为的方法、装置及电子设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109783750A (zh) |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110765746A (zh) * | 2019-10-15 | 2020-02-07 | 支付宝(杭州)信息技术有限公司 | 基于事件代理的表单自动生成方法和系统 |
CN111179439A (zh) * | 2019-12-24 | 2020-05-19 | 武汉理工光科股份有限公司 | 基于three.js的网页端三维空间内部物体交互操作方法 |
CN111274574A (zh) * | 2020-01-16 | 2020-06-12 | 恩亿科(北京)数据科技有限公司 | 网页事件防抖方法、装置、服务器及计算机可读存储介质 |
CN111736820A (zh) * | 2020-06-24 | 2020-10-02 | 支付宝(杭州)信息技术有限公司 | 一种可视化程序开发方法及装置 |
CN113377459A (zh) * | 2021-07-04 | 2021-09-10 | 芯河半导体科技(无锡)有限公司 | 基于CGI Web展示xTables配置的方法 |
CN113377264A (zh) * | 2021-06-02 | 2021-09-10 | 浪潮软件股份有限公司 | 一种网页中反馈式交互方法 |
CN115080175A (zh) * | 2022-08-22 | 2022-09-20 | 统信软件技术有限公司 | 显示方法、装置、计算设备及可读存储介质 |
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102314431A (zh) * | 2010-06-30 | 2012-01-11 | 上海视加信息科技有限公司 | 一种生成网页的方法 |
CN104572092A (zh) * | 2014-12-26 | 2015-04-29 | 北京奇虎科技有限公司 | 网页制作方法与装置 |
US20160259773A1 (en) * | 2015-03-04 | 2016-09-08 | Tata Consultancy Services Limited | System and method for identifying web elements present on a web-page |
CN106445486A (zh) * | 2009-07-06 | 2017-02-22 | 孟智平 | 一种构造和生成网页的方法及系统 |
CN106484393A (zh) * | 2016-09-13 | 2017-03-08 | 厦门兆慧网络科技有限公司 | 一种可视化视图设计方法 |
CN106610826A (zh) * | 2015-10-23 | 2017-05-03 | 腾讯科技(深圳)有限公司 | 在线场景应用的制作方法及装置 |
CN106648659A (zh) * | 2016-12-22 | 2017-05-10 | 杭州铜板街互联网金融信息服务有限公司 | 网页制作方法及系统 |
CN107463584A (zh) * | 2016-06-06 | 2017-12-12 | 腾讯科技(深圳)有限公司 | 一种交互页面的编辑处理方法及终端 |
CN108762878A (zh) * | 2018-06-05 | 2018-11-06 | 广州视源电子科技股份有限公司 | 一种应用程序互动界面生成方法、装置、设备及存储介质 |
-
2018
- 2018-12-13 CN CN201811526895.7A patent/CN109783750A/zh active Pending
Patent Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106445486A (zh) * | 2009-07-06 | 2017-02-22 | 孟智平 | 一种构造和生成网页的方法及系统 |
CN102314431A (zh) * | 2010-06-30 | 2012-01-11 | 上海视加信息科技有限公司 | 一种生成网页的方法 |
CN104572092A (zh) * | 2014-12-26 | 2015-04-29 | 北京奇虎科技有限公司 | 网页制作方法与装置 |
US20160259773A1 (en) * | 2015-03-04 | 2016-09-08 | Tata Consultancy Services Limited | System and method for identifying web elements present on a web-page |
CN106610826A (zh) * | 2015-10-23 | 2017-05-03 | 腾讯科技(深圳)有限公司 | 在线场景应用的制作方法及装置 |
CN107463584A (zh) * | 2016-06-06 | 2017-12-12 | 腾讯科技(深圳)有限公司 | 一种交互页面的编辑处理方法及终端 |
CN106484393A (zh) * | 2016-09-13 | 2017-03-08 | 厦门兆慧网络科技有限公司 | 一种可视化视图设计方法 |
CN106648659A (zh) * | 2016-12-22 | 2017-05-10 | 杭州铜板街互联网金融信息服务有限公司 | 网页制作方法及系统 |
CN108762878A (zh) * | 2018-06-05 | 2018-11-06 | 广州视源电子科技股份有限公司 | 一种应用程序互动界面生成方法、装置、设备及存储介质 |
Non-Patent Citations (1)
Title |
---|
李兰友: "《Visual Basic.NET程序设计教程》", 31 May 2005 * |
Cited By (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110765746A (zh) * | 2019-10-15 | 2020-02-07 | 支付宝(杭州)信息技术有限公司 | 基于事件代理的表单自动生成方法和系统 |
CN110765746B (zh) * | 2019-10-15 | 2023-08-15 | 支付宝(杭州)信息技术有限公司 | 基于事件代理的表单自动生成方法和系统 |
CN111179439A (zh) * | 2019-12-24 | 2020-05-19 | 武汉理工光科股份有限公司 | 基于three.js的网页端三维空间内部物体交互操作方法 |
CN111179439B (zh) * | 2019-12-24 | 2023-05-09 | 武汉理工光科股份有限公司 | 基于three.js的网页端三维空间内部物体交互操作方法 |
CN111274574A (zh) * | 2020-01-16 | 2020-06-12 | 恩亿科(北京)数据科技有限公司 | 网页事件防抖方法、装置、服务器及计算机可读存储介质 |
CN111736820A (zh) * | 2020-06-24 | 2020-10-02 | 支付宝(杭州)信息技术有限公司 | 一种可视化程序开发方法及装置 |
CN113377264A (zh) * | 2021-06-02 | 2021-09-10 | 浪潮软件股份有限公司 | 一种网页中反馈式交互方法 |
CN113377459A (zh) * | 2021-07-04 | 2021-09-10 | 芯河半导体科技(无锡)有限公司 | 基于CGI Web展示xTables配置的方法 |
CN115080175A (zh) * | 2022-08-22 | 2022-09-20 | 统信软件技术有限公司 | 显示方法、装置、计算设备及可读存储介质 |
CN115080175B (zh) * | 2022-08-22 | 2022-12-02 | 统信软件技术有限公司 | 显示方法、装置、计算设备及可读存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109783750A (zh) | 事件机制定义网页交互行为的方法、装置及电子设备 | |
CN106170789B (zh) | 用于向创意的着陆页提供功能扩展的方法和系统 | |
CN109933760A (zh) | 表单生成方法、装置、计算机设备及计算机可读存储介质 | |
US20180275985A1 (en) | Workflow generation and editing | |
US9063740B2 (en) | Web widget component for a rapid application development tool | |
CN104657451B (zh) | 页面的处理方法及装置 | |
US20120030592A1 (en) | Mashup Component Authoring Tool For Business Enterprise User Interfaces | |
CN103984626B (zh) | 一种生成测试用例脚本的方法及装置 | |
Macik et al. | Context-sensitive, cross-platform user interface generation | |
Deka et al. | Zipt: Zero-integration performance testing of mobile app designs | |
US20120290935A1 (en) | Information processing apparatus, server device, information processing method, computer program, and content sharing system | |
CN110532159A (zh) | 数据监听方法、装置、设备及计算机可读存储介质 | |
US20120287020A1 (en) | Information processing apparatus, information processing method, and computer program | |
CN104115143A (zh) | 多个选项卡堆叠用户界面 | |
CN105302461B (zh) | 一种用于在移动应用中提供目标页面的方法与设备 | |
US10289388B2 (en) | Process visualization toolkit | |
US10210001B2 (en) | Automatic execution of objects in a user interface | |
CN103914292A (zh) | 基于丰富互联网应用ria的用户界面生成方法和装置 | |
US20070043547A1 (en) | Integrated debugging environment for a network simulation | |
US10783063B2 (en) | Systems and methods for testing a customer environment | |
CN102855266A (zh) | 一种信息系统创建方法、装置及系统 | |
Schuler et al. | Rule-based generation of mobile user interfaces | |
US20170102861A1 (en) | Natural Language Creation Tool for Applications, and an End User Drag and Drop Site-Building Design Canvas for Viewing and Analyzing User Adoption | |
CN105531661B (zh) | 全屏内容查看界面进入 | |
Fatima et al. | Extending interaction flow modeling language (ifml) for android user interface components |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination |