Atlas中的Behavior定義了當控件的某個事件被觸發時的行為。Behavior可以看作是一種封裝了的DHTML的事件，例如click和hover等。Behavior同樣可以是一個組件，可被attach到某個Atlas客戶端控件上，以提供這個Atlas客戶端控件更高級，更豐富的功能，例如一些復雜的拖放（drag & drop），自動完成，浮動等功能。Behavior將被定義在某個Atlas控件的behaviors集合中。

從Atlas文檔以及源文件中，我們可以知道Atlas有如下一些內建的Behavior：

Click Behavior：提供對鼠標點擊的處理。

Floating Behavior：提供拖放（drag & drop）的效果。

Hover Behavior：提供對DHTML的事件onmouseover，onmouseout，onfocus以及onblur的處理。

Pop-up Component：提供pop-up的功能，可以用來實現高級的tooltip。

Auto-complete Behavior：提供自動完成的功能。這也是Atlas演示中常用的功能之一。這個Behavior還需要服務器端的處理程序。

Click Behavior用來處理DHTML的onclick事件，非常有用但是它提供的功能有些簡單。在一些比較復雜的程序中，我們可能需要將左右鍵的功能分開，例如，左鍵用來選擇，右鍵用來彈出快捷菜單。雖然我們可以把這個if-else放在Click Behavior的處理函數中，但這并不是好的Atlas的方法。因此，今天我們來編寫一個更加強大的Click Behavior，叫做ExtendedClickBehavior，它可以在Behavior的內部就把左右鍵分開，并且引發出兩個不同的事件。通過編寫這個ExtendedClickBehavior，您也可以了解在Atlas中創建自定義的Behavior的一般過程。

通常的，創建自定義的Behavior有如下5個步驟：

繼承于Sys.UI.Behavior基類。

定義您自己的事件以封裝DHTML中的事件。這些事件將被用來暴露給其他的Atlas控件以代替原有的，未經修飾的DHTML事件。

在Behavior的構造函數中為您的事件指定處理函數，并在析構函數中detach事件的處理函數。

在處理函數中發出相應的事件。在ExtendedClickBehavior的例子中，我們根據鼠標按鍵的不同來發出不同的事件。

在getDescriptor()方法中加上對您定義的事件的描述。

下面是ExtendedClickBehavior的JavaScript代碼。上述五個步驟在代碼內以注釋的形式標出。將下面的代碼保存為ExtendedClickBehavior.js。

Sys.UI.ExtendedClickBehavior = function() { Sys.UI.ExtendedClickBehavior.initializeBase(this); var _clickHandler; // step 2 this.click = this.createEvent(); this.leftClick = this.createEvent(); this.rightClick = this.createEvent(); this.dispose = function() { // step 3 this.control.element.detachEvent('onmousedown', _clickHandler); Sys.UI.ExtendedClickBehavior.callBaseMethod(this, 'dispose'); } this.initialize = function() { Sys.UI.ExtendedClickBehavior.callBaseMethod(this, 'initialize'); // step 3 _clickHandler = Function.createDelegate(this, clickHandler); this.control.element.attachEvent('onmousedown', _clickHandler); } this.getDescriptor = function() { var td = Sys.UI.ExtendedClickBehavior.callBaseMethod(this, 'getDescriptor'); // step 5 td.addEvent('click', true); td.addEvent('leftClick', true); td.addEvent('rightClick', true); return td; } // step 4 function clickHandler() { this.click.invoke(this, Sys.EventArgs.Empty); if (window.event.button == 1) { this.leftClick.invoke(this, Sys.EventArgs.Empty); } else if (window.event.button == 2) { this.rightClick.invoke(this, Sys.EventArgs.Empty); } } } // step 1 Sys.UI.ExtendedClickBehavior.registerSealedClass('Sys.UI.ExtendedClickBehavior', Sys.UI.Behavior); Sys.TypeDescriptor.addType('script', 'extendedClickBehavior', Sys.UI.ExtendedClickBehavior);

讓我們在頁面中測試一下這個ExtendedClickBehavior。在頁面上添加一個＜div＞用來點擊，一個label用來顯示點擊的信息。下面是ASPX文件中的HTML定義。不要忘記在ScriptManager中添加對ExtendedClickBehavior.js文件的引用。

＜atlas:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server"＞ ＜Scripts＞ ＜atlas:ScriptReference Path="ExtendedClickBehavior.js" /＞ ＜/Scripts＞ ＜/atlas:ScriptManager＞ ＜div＞ ＜div id="myButton" style="border: 1px solid black; width: 20em; white-space:normal"＞Click On Me (Left and Right)!＜/div＞ ＜br /＞ ＜span id="myLabel"＞not clicked＜/span＞ ＜/div＞

下面是Atlas腳本定義。注意到我們使用了Atlas的setProperty Action（有關Atlas Action，請見后續文章）用來在每次點擊后設置label的text。

＜page xmlns:script="http://schemas.microsoft.com/xml-script/2005"＞ ＜components＞ ＜label id="myButton"＞ ＜behaviors＞ ＜extendedClickBehavior＞ ＜click＞ ＜setProperty target="myLabel" property="text" value="clicked" /＞ ＜/click＞ ＜leftClick＞ ＜setProperty target="myLabel" property="text" value="left clicked" /＞ ＜/leftClick＞ ＜rightClick＞ ＜setProperty target="myLabel" property="text" value="right clicked" /＞ ＜/rightClick＞ ＜/extendedClickBehavior＞ ＜/behaviors＞ ＜/label＞ ＜label id="myLabel" /＞ ＜/components＞ ＜/page＞

瀏覽器中的運行結果：
沒有點擊：

左鍵點擊：


右鍵點擊：


上述示例程序可以在此下載：http://www.cnblogs.com/Files/dflying/ExtendedClickBehaviorDemo.zip