初探HTML组件-定义事件    

定义事件

要在 HTC 中定义一个事件,我们需要用到 PUBLIC:EVENT 元素。当我们定义了一个事件后,我们就可以在 HTC 的所在页中来调用它。

在下面的例子中来示范如何实现一个计算器的功能。在 HTC 中我们使用 EVENT 元素定义了一个 onResultChange 事件。当在所在页中激活 onResultChange 事件时,HTC 将计算出结果并返回到所在页。

<BR><PUBLIC:EVENT NAME=onResultChange ID=rcID /> <BR><SCRIPT LANGUAGE="JScript"> <BR>: <BR>oEvent = createEventObject(); <BR>oEvent.result = sResult; <BR>rcID.fire (oEvent); <BR>: <BR></SCRIPT> <BR>

下面是含有这个 HTC 的页面:

<BR><HTML XMLNS:InetSDK> <BR><HEAD> <BR><TITLE>Calculator Sample</TITLE> <P><STYLE> <BR>INPUT {font-family: Courier New} <BR>@media all { <BR>InetSDK:CALC {behavior:url(Engine.htc)} <BR>} <BR></STYLE> </P> <P><LINK REL="stylesheet" HREF="/workshop/basicSDKIE4.css" TYPE="text/css"> <BR></HEAD> </P> <P><BODY BGCOLOR="<BLOCKQUOTE CLASS="body"> </P> <P><P> <BR><InetSDK:CALC id="myCalc" onResultChange="resultWindow.innerText =window.event.result"> <BR><TABLE> <BR><TR> <BR><TD COLSPAN=5> <BR><DIV ID="resultWindow" STYLE="padding:5; background-color:buttonface" ALIGN="RIGHT">0.</DIV> <BR></TD> <BR></TR> <BR><TR> <BR><TD><INPUT TYPE=BUTTON VALUE=" 7 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" 8 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" 9 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" / "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" C "></TD> <BR></TR> <BR><TR> <BR><TD><INPUT TYPE=BUTTON VALUE=" 4 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" 5 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" 6 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" * "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" % " DISABLED></TD> <BR></TR> <BR><TR> <BR><TD><INPUT TYPE=BUTTON VALUE=" 1 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" 2 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" 3 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" - "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE="1/x" DISABLED></TD> <BR></TR> </P> <P><TR> <BR><TD><INPUT TYPE=BUTTON VALUE=" 0 "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE="+/-"></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" . "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" + "></TD> <BR><TD><INPUT TYPE=BUTTON VALUE=" = "></TD> <BR></TR> <BR></TABLE> <BR></InetSDK:CALC> <BR></BLOCKQUOTE> <BR></BODY> <BR></HTML> <BR>

注意:本文的所有例子都需要在 IE5 以上版本的浏览器中才能看到应有的效果。

关联文档