Script.aculo.us开发系列(八):使用DropDrag定义拖拽行为

核心提示： tag:能被拖动元素的标签,默认为"li"hoverclass:拖动经过可以放置的位置是,可放置的元素的classNamedropOnEmpty:默认为false,是否在空的元素上放置handle/delayscroll/scrollSensitivity/scroll

tag:能被拖动元素的标签,默认为"li"

hoverclass:拖动经过可以放置的位置是,可放置的元素的className

dropOnEmpty:默认为false,是否在空的元素上放置

handle/delayscroll/scrollSensitivity/scrollSpeed::同Draggable

containment:数组,存放所有的放置元素的ID,参见实例的最后一个例子

onUpdate():该方法接受参数$("ContainerId"),在拖动到可放置位置是调用该方法

onChange():结束拖拽行为时调用该方法,接受参数element,表示被拖拽的元素

serialize(sortable)方法:该方法返回当前容器内元素的次序,但是要求子元素的id必须以"item_"开头,且返回格式有讲究,看下面的例子

<div id="horizontalSortable" class="item" style="margin-top:20px; height:40px;">
　　　<div id="item_5">IE</div>
　　　<div id="item_6">FireFox</div>
　　　<div id="item_7">Safari</div>
　　　<div id="item_8">Opera</div>
</div>
　　
Sortable.create("horizontalSortable",
{
　　 ghosting:true,
　　 tag:'div',
　　 constraint:'horizontal',
　　 hoverclass:'hoverClass2'
});
　　
Sortable.serialize('horizontalSortable')
//-->horizontalSortable[]=5&horizontalSortable[]=6&horizontalSortable[]=7&horizontalSortable[]=8