标签:des style http java os io for art
项目里用到这个列表排序插件,比较好用,不依赖jQuery,另源码也有很多可借鉴的地方,故推荐给大家试试。
<ul id="items"> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ul>
```js var el = document.getElementById(‘items‘); new Sortable(el);
new Sortable(el, { group: "name", store: null, // @see Store handle: ".my-handle", // Restricts sort start click/touch to the specified element draggable: ".item", // Specifies which items inside the element should be sortable ghostClass: "sortable-ghost", onStart: function (/**Event*/evt) { // dragging var itemEl = evt.item; }, onEnd: function (/**Event*/evt) { // dragging var itemEl = evt.item; }, onAdd: function (/**Event*/evt){ var itemEl = evt.item; }, onUpdate: function (/**Event*/evt){ var itemEl = evt.item; // the current dragged HTMLElement }, onRemove: function (/**Event*/evt){ var itemEl = evt.item; } });
String[]
Serializes the sortable‘s item data-id‘s into an array of string.
Array
)Sorts the elements according to the array.
var order = sortable.toArray(); sortable.sort(order.reverse()); // apply
Saving and restoring of the sort.
new Sortable(el, { group: "localStorage-example", store: { /** * Get the order of elements. Called once during initialization. * @param {Sortable} sortable * @retruns {Array} */ get: function (sortable) { var order = localStorage.getItem(sortable.options.group); return order ? order.split(‘|‘) : []; }, /** * Save the order of elements. Called every time at the drag end. * @param {Sortable} sortable */ set: function (sortable) { var order = sortable.toArray(); localStorage.setItem(sortable.options.group, order.join(‘|‘)); } } })
:HTMLElement
, event:String
, fn:Function
) — attach an event handler function:HTMLElement
, event:String
, fn:Function
) — remove an event handler:HTMLElement
):Object
— get the values of all the CSS properties:HTMLElement
, prop:String
):Mixed
— get the value of style properties:HTMLElement
, prop:String
, value:String
) — set one CSS properties:HTMLElement
, props:Object
) — set more CSS properties:HTMLElement
, tagName:String
[, iterator:Function
]):Array
— get elements by tag name:Mixed
, fn:Function
):Function
— Takes a function and returns a new one that will always have a particular context:HTMLElement
, selector:String
[, ctx:HTMLElement
]):HTMLElement|Null
— for each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree:HTMLElement
, name:String
, state:Boolean
) — add or remove one classes from each elementno-jQuery 列表<li>排序插件 -- Sortable.js,布布扣,bubuko.com
no-jQuery 列表<li>排序插件 -- Sortable.js
标签:des style http java os io for art
原文地址:http://my.oschina.net/luozt/blog/296944