這是一個基于jquery寫的標簽拖拽小組件么抗，作為即將畢業(yè)的菜鳥程序員，可能代碼寫得比較low，不過還是有小小的成就感。
使用
1.新建配置
let option = {
? ? dragbox: {
? ? ? width: '400px',//dragbox寬度僚楞，可以設置為百分比
? ? ? fontSize: '14px',//字體大小
? ? ? backgroundColor: '#87cefa',//dragbox背景顏色
? ? },
? ? draglist: {
? ? ? listSize: 4, //每行標簽個數
? ? ? height: '40px', //每個標簽高度
? ? ? data: ['item1', 'item2', 'item3', 'item4', 'item5', 'item6', 'item7'], //標簽數據
? ? ? backgroundColor: ['#00ae9d', '#11264f', '#2570a1'],//每個標簽背景顏色，多個循環(huán)顯示
? ? ? margin: '1.5%',//標簽外邊距
? ? },
? }
2.創(chuàng)建對象
創(chuàng)建一個id為test1的div元素
<div id="test1"></div>
創(chuàng)建一個dragbox對象枉层，并初始化
let oj = dragbox.init(document.getElementById('test1'))
3.使用第一步設置的配置
oj.setOption(option)
4.獲取拖拽后的排序數據
console.log(oj.getCurrentData())
//print:['item1', 'item2', 'item3', 'item4', 'item5', 'item6', 'item7']
5.綁定拖拽完成后觸發(fā)的方法(綁定多個泉褐，按順序執(zhí)行)
? function test1() {
? ? console.log(oj.getCurrentData())
? ? console.log('執(zhí)行第一個方法')
? }
? function test2() {
? ? console.log('執(zhí)行第二個方法')
? }
? oj.bindFunction(test1, test2)
