//第一组 var moveItemId = -1; var g1 = document.getElementById('g1'); var ops1 = { animation: 166, draggable: ".item", sort: true, group: { name: "itxst.com", pull: function () { //第二个元素不允许被拖走 if (moveItemId == '2') return false; return 'clone'; }, put: function () { //B组的google不允许被拖入 if (moveItemId == '5') return false; return true; } }, //开始拖动记录下用户点击的那个元素 onStart: function (evt) { moveItemId = evt.clone.dataset.id; }, //拖动结束 onEnd: function (evt) { console.log(evt); //获取拖动后的排序 var arr = sortable1.toArray(); document.getElementById("msg").innerHTML = "A组排序结果:" + JSON.stringify(arr); }, }; var sortable1 = Sortable.create(g1, ops1); //第二组 var g2 = document.getElementById('g2'); var ops2 = { animation: 166, draggable: ".item", sort: false, group: { name: "itxst.com", pull: true, put: true }, //开始拖动记录下用户点击的那个元素 onStart: function (evt) { moveItemId = evt.clone.dataset.id; }, //拖动结束 onEnd: function (evt) { console.log(evt); //获取拖动后的排序 var arr = sortable2.toArray(); document.getElementById("msg").innerHTML = "B组排序结果:" + JSON.stringify(arr); }, }; var sortable2 = Sortable.create(g2, ops2); //第三组 var g3 = document.getElementById('g3'); var ops3 = { animation: 166, draggable: ".item", group: { name: "itxst.com", pull: true, put: true }, //拖动结束 onEnd: function (evt) { console.log(evt); //获取拖动后的排序 var arr = sortable3.toArray(); document.getElementById("msg").innerHTML = "C组排序结果:" + JSON.stringify(arr); }, }; var sortable3 = Sortable.create(g3, ops3);