jQuery鼠标上下拖动div排序代码

jQuery鼠标上下拖动div排序代码、鼠标拖动层改变排列顺序，div左上角还有按钮操作，点击只是弹窗提示效果。

js代码
<scripttype="text/javascript"src="jquery.min.js"></script>
<scripttype="text/javascript"src="Sortable.min.js"></script>
<scripttype="text/javascript"src="moduleSet.min.js"></script>
<scripttype="text/javascript">
//调用$(".js_module_1").moduleSet({
button:[
{text:'编辑',callback:function(){alert('编辑')},iconfont:''},
{text:'删除',callback:function(){alert('删除')},iconfont:''},
],
})
$(".js_module_2").moduleSet({
button:[
{text:'编辑',callback:function(){alert('编辑2')},iconfont:''},
{text:'美化',callback:function(){alert('美化2')},iconfont:''},
],
})$(".js_module_3").moduleSet({
button:[
{text:'编辑',callback:function(){alert('编辑3')},iconfont:''},
{text:'美化',callback:function(){alert('美化3')},iconfont:''},
],
})//排序
varcontainer=document.getElementById("container");
varsort=Sortable.create(container,{
animation:150,//ms,animationspeedmovingitemswhensorting,`0`—withoutanimation
handle:".module1",//Restrictssortstartclick/touchtothespecifiedelement
draggable:".module1",//Specifieswhichitemsinsidetheelementshouldbesortable
onUpdate:function(evt/**Event*/){
alert(11)
varitem=evt.item;//thecurrentdraggedHTMLElement
}
});
</script>



下载

2023-11-22 21:19 上传

点击文件名下载附件
售价: 1 金币  [记录]  [购买]