scriptaculous 序列化 拖動div

2021-08-22 13:55:25 字數 1386 閱讀 1305

準備

包含庫檔案:

可排序物件

例子:以下**將建立乙個列表,並且可以拖動排序,每次移動戶都將觸發乙個可以返回列表順序的函式,並且已經序列化,可以通過ajax傳給伺服器端。

//建立列表:

//開始建立可排序元件

// 而非整個

建構函式中的引數列表:

引數名 初始值 說明

element: element

tag: 'li', // assumes li children,標籤內可被拖動的子標籤名

droponempty: false, ??

tree: false, // fixme: unimplemented ??

overlap: 'vertical', // one of 'vertical', 'horizontal'

constraint: 'vertical', // one of 'vertical', 'horizontal', false

handle: false, // or a css class ,css樣式是此handle指定樣式的標籤部分可拖動如為false則整體可拖.

only: false, ???

hoverclass: null, //被拖入位置的css

ghosting: false, //顯示殘影佔位

format: null, //???

onchange: prototype.emptyfunction,

onupdate: prototype.emptyfunction

droponempty: true //or false 指定此等可排序區域可否接受其他中的元素

containment: ["list1","list2"] 當droponempty設為true,在此引數中設定可接受的列表id

除了建構函式,其餘的常用方法:

l sortable.serialize(sortable) 靜態方法。返回乙個當前sortable物件的按照排序順序先後排列序號的字串:如x=1& x=2& x=3,每乙個的序號通過1的下滑線後面的數字指定。下滑線前面的單詞在一組排序中應使用乙個相同的字首。不同的組,字首應該不同。

l sortable .destroy(sortable) 靜態方法。撤銷此物件的排序屬性。

常見問題:

當我們給外面加上div,比如

我們會發現頁面一團糟了,ul溢位了div, 頁面亂七八糟。

不用急,在div的style中加入 「position:relative;」就解決了不聽指揮的問題。

現在再用一下,拖動有點問題……我們會發現定位不準確了,這是因為沒有考慮到滾動條的偏移量。

position.includescrolloffsets = true;

此問題便會迎刃而解~~!哈。

scriptaculous 效果集合

包含以下幾個部分 提供了一種方便的建立html元素的方法 controls.js dragdrop.js 提供元素拖放的功能 effects.js slider.js 乙個滑動條控制項 消失效果 new effect.puff 放大後消失 new effect.squish 元素左上腳消失效果 ne...

序列 建立序列

序列 1序列是oacle提供的用於產生一系列唯一數字的資料庫物件。2使用序列可以實現自動產生主鍵值 3序列可以在多使用者併發環境中使用,為所有使用者生成不重複的順序數字,而且不需要任何額外的i o開銷。4序列與檢視一樣,不占用實際的儲存空間,只是在資料字典中保留它的定義資訊。5自己模式建立序列,需要...

Python序列應用 序列

1 序列 說明 1.1 序列是一塊用於存放多個值的連續記憶體空間,並且按一定順序排列,每個值 元素都分配乙個數字,稱為索引或位置,通過該索引可以取出相應的值。1.2 在python中,序列結構主要有列表 元組 集合 字典。對於這些序列結構有以下幾個通用的操作。2 索引 說明 2.1 序列中的每乙個元...