本文将深入探讨如何利用scriptaculous的一些特性，包括拖放功能、分类等。我们从给一个基本的网页增加拖放特性开始进行说明。
拖放分类
使用scriptaculous库分为三步：
scriptaculous库的第一个应用包括通过简单拖放单个项目给用户增加项目分类功能。在这个例子中，使用一个未分类的列表为元素。
关于增加JavaScript代码调用scriptaculous函数的一点提示：你应该通过CDATA段对代码进行格式化，以避免JavaScript中的一些特殊字符与HTML字符造成冲突。
列表A利用scriptaculous的Sortable特性，允许用户用鼠标拖放对一个项目列表进行分类。代码列表的主要部分为Sortable.create行，它建立一个分配给特定项目的可分类的元素（带group1的id值）。如果你加载这个页面，你可以在列表中轻易地上下拖动项目。
我们可以对上面的例子进行扩充，利用两个列表，允许项目在它们之间拖动。使用两个列表的关键在于为第二个列表建立第二个Sortable对象，并告诉Sortable对象要处理哪些对象。列表B中的代码处理这个任务。注意，第二个例子在调用Sortable.create方法时，给容纳值提交了两个列表。它还使用了分配给两个列表的id值，因此可以对列表进行分类，并在列表间移动列表元素。
在用户对列表项目进行分类以后，你可能希望保存分类结果。Sortable对象提供系列化功能，能够以适合HTTP GET或POST要求的格式对项目进行序列化。它返回一个类似于通过GET提交的HTML表单结果的字符串数组值。
序列化功能的麻烦之处在于它返回一个与列表元素对应的数字，并且它要求使用字符串值，后面接下划线（_）以及数字对列表项目命名（就像在前一个例子中宣称的单个元素一样）。使用这种命名方式，序列化方法返回列表中项目下划线后面的数字。因此，当如果对前一个例子中的第一个列表调用序列化方法（页面加载之初），即返回以下结果：
group1[]=1&group1[]=2&group1[]=3& group1[]=4&group1[]=5&group1[]=6&
group1[]=7&group1[]=8&group1[]=8&group1[]=10
在页面上拖动项目
scriptaculous库的一个显著特点在于，它可以方便地在页面上拖动元素。也就是说，用户可以在页面上选择一个元素，然后用鼠标把它拖动到另一个地方。列表C说明如何实现这种操作。
前一个例子的关键之处在于在代码的末尾建立Draggable对象。和scriptaculous的所有特点一样，这个代码应放置在所有必要的页面元素之后（页面末尾最好）。
因此，要使一个元素可在页面上拖动，只需建立一个新的Draggable对象实例，再把对象名称作为第一个参数提交即可。当用户释放一个项目（真），或将它移动到新位置（假）时，可选的回返参数允许你指定该项目是否返回到原始位置。你可以将它与Droppable对象结合使用，从而定义项目的放置位置。Droppable对象还允许你访问已被移动或放置的项目。
视觉效果
移动和元素分类很有用，但scriptaculous还可以在页面上轻松实现各种视觉效果，从而提供更多乐趣。你可以对页面元素应用大量的视觉效果，列表D中的例子仅使用了其中几个效果。
这个页面包含三个图片和一个文本元素。第一幅图片通过Effects.Fade方法逐渐淡出视线；第二幅图片通过Effects对象的Pulsate方法在屏幕上闪烁或跳动；第三幅图片使用Effects对象的Shake方法前后晃动。最后，通过使用Effects.Highlight方法将页面的标题文本用灰色高亮显示。一旦页面和它的元素通过子元素的onLoad事件加载后，脚本即调用Effects对象和各种方法。
scriptaculous库提供的许多效果只有一个样本。你可以在scriptaculous wiki上找到更多与视觉效果有关的细节。
应用
scriptaculous库帮助你轻松建立各种令人兴奋的多功能Web用户界面。它将复杂的设计元素减少为几行脚本，因此你没有理由不在下一个（或现有的）Web应用程序中使用如此优秀的功能。现在就下载这个强大的工具并学习更多相关内容。