Nitrogen 学习过程实录（11）

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时，才挂连事件。