当前位置: 首页 > 工具软件 > nitrogen > 使用案例 >

Nitrogen 学习过程实录(11)

楮阳
2023-12-01

6、Nitrogen 的事件处理

这个问题比较高深,不弄明白就是糊弄自己。幸好google到老外的一篇网文,译出来。

(1) Nitrogen的事件,是由用户在网页上的点击等行为引发的特定操作(action)。

Nitrogen事件最常用于向服务器汇报(postback)。汇报的内容产生后,调用动态网页(程序模块)中的函数event/1,

于是,你可以用Ajax技术进行逻辑操作,并且更新网页。

例如,下列代码完成一项任务:点击网页文字时,向服务器汇报:

#span { 

  text="Posts back when clicked.", 

  actions=#event { type=click, postback=got_click }

}

Nitrogen事件也可以在浏览器中有条件地运行Javascript。例如,下列代码完成一项任务:点击网页文字时,显示Javascript提示窗(alert):

#span { 

  text="Posts back when clicked.", 

  actions=#event { type=click, actions=#alert { text="Click!" }}

}

2种形式的事件可以同时使用。例如,你可以用汇报型事件让服务器保存用户的文章,同时用Javascript提示窗口指出文件正在保存。

(2) 汇报型事件

汇报型事件是如何工作的?

用户的操作引发事件后,Javascript函数汇集网页的状态,向Nitrogen管理下的web服务器做出Ajax汇报。

Nitrogen检查汇报的参数,弄清是哪个网页元件发出的请求后,调用请求网页(模块)的函数event/1。

你可在函数event/1中执行自定的逻辑操作,用Ajax更新HTML页面。为了防止网页变化混乱,同一时间内只许处理一个汇报型件。事件在队列中依序运行。

如果有多个事件同时刷新网页,后果难料。

(3) 事件标签的灵活性

事件标签是Erlang的“项”(term),汇报型事件发生后,它被送往函数event/1。你可在标签中指定合法的、任意的Erlang项。但要注意,标签越大越多,网页体积也越大。

在你的函数event/1中,用模式匹配捕获传来的标签。例如:

#span { 

  id=mySpan, text="Click here.", 

  actions=#event { type=click, postback={got_click, mySpan, [1, two, "three"]} }

}

(4) 便捷方式

在绝大多数情况下,你对元件#textbox或#link设置的事件,要求很简单,它们被点击时就发出汇报型事件。这是个标准的操作方式,于是这些元件支持绑定事件的便捷方式。

只需简单地设置textbox或link的属性。它们被点击时,会自动发出汇报型事件,所设属性即事件标签。例如:

#textbox { text="Click Me", postback=got_click } 

(5) 非汇报型的事件

如上所说,并非全部的#event行为(actions)必须向服务器汇报。#event行为可以包含其他行为,事件触发时,其他行为被执行。例如,下列代码使得文字被点击时,逐渐消隐:

#span { 

  text="Disappears when clicked.", 

  actions=#event { type=click, actions=#effect_fade{} } 

}

你可以用嵌套的#event标签,进行复杂操作。例如,点击元件后,显示Javascript提示窗口,若用户接着点击OK,才可发出汇报型事件。

(6) #event行为的属性

type – 各种合法的Javascript事件,包括:click, mouseover, mouseout, mousedown, mouseup, focus, blur等。

postback – 事件触发时,传送给函数event/1的标签。

actions – 事件触发后将要采取的行动。

delegate – 函数event/1所在的模块。默认是当前网页。

trigger – 触发事件的元件。

target – 由于事件的发生,用Javascript更改的元件。

show_if – 只有当设置为true时,才挂连事件。

 

 

 类似资料: