javascript - SortableJS 列表和固定/锁定项目
问题描述
我需要创建一个可排序的拖放列表,其中可以固定一个或多个位置以及链接模型:
var locktos = [];
$(document).ready(function() {
$("#sortable li.static").each(function () {
locktos.push($(this).index());
$(this).attr("id", "static-" + $(this).index());
});
alert($("#sortable li").eq(locktos[1]).attr("id"));
});
$("#sortable").sortable({
"cancel":"li.static",
"change":function(event,ui) {
// var locktos = [1, 5];
for(i=0;i<locktos.length;i++) {
console.log(locktos[i]);
var thisindex = $(ui.helper).index();
var fixed = $("#static-"+locktos[i]);
var index = fixed.index();
var targetindex = locktos[i]+1;
console.log(index + ", targetindex: " + targetindex);
if(index !== targetindex) {
if(index > targetindex ) {
fixed.prev().insertAfter(fixed); //move it up by one position
} else if(index==(targetindex-1) && thisindex>targetindex) {
//don't move it at all
} else {
fixed.next().insertBefore(fixed); //move it down by one position
}
} else if(index==targetindex && thisindex>targetindex) {
fixed.prev().insertAfter(fixed); //move it up by one position
}
}
}
});
ul > li {display:block;height:15px;width:100px;background:#ccc;margin:2px;padding:3px;border:1px solid #aaa;}
<ul id="sortable">
<li>oranges</li>
<li class="static">apples</li>
<li>bananas</li>
<li>pineapples</li>
<li>grapes</li>
<li class="static">pears</li>
<li>mango</li>
</ul>
但我需要使用来自http://sortablejs.github.io/Sortable/下面这个链接的 SortableJS 插件来做到这一点
解决方案
推荐阅读
- python - 检查以太坊域名是否注册python
- python - 保存为分区镶木地板时是否可以更改输出文件名?
- pandas - 如何在 Pandas 中不使用 One-Hot-Encoding 重新编码 53k 个唯一地址(保存为对象)?
- spring - 在 Gradle 中需要 2 个不同版本的相同依赖项
- c# - 尝试在 Window Task Scheduler 上运行应用程序,该任务将一直运行直到超时
- flutter - 基于按钮单击刷新列表视图
- tensorflow - tensorflow中的梯度计算导入pb文件的graph_def(对象检测)
- outlook - 如何在共享的 Outlook 日历中查找谁创建了约会?
- html - 如何改进此复选框列表以确保某些文本不在复选框下方?
- java - 如何使方法的参数泛型