sortable.js delay属性鼠标按下后多久才允许拖动

sortable.js delay属性鼠标按下后多久才允许拖动,比如你拖拽的元素还包含其他事件如编辑删除事件,如果不设置该属性虽然可以执行删除事件,但是该元素会被轻微的被拖动一下,用户体验非常不好。

delay属性

例子

html代码

<div class="box">
    <div id="g1" class="itxst">
        <div>点击按住鼠标1秒后再拖动</div>
        <div class="item" data-id="1" onclick="del()">item 1</div>
        <div class="item" data-id="2"  onclick="del()">item 2</div>
        <div class="item" data-id="3"  onclick="del()">item 3</div>
    </div> 
</div>
<div id="msg"></div>

js代码

//第一组 
var g1 = document.getElementById('g1');
var ops1 = {
    animation: 1000,
    draggable: ".item",
    delay: 1000,  
    //拖动结束
    onEnd: function (evt) {
        console.log(evt);
        //获取拖动后的排序
        var arr = sortable1.toArray();
        document.getElementById("msg").innerHTML = "A组排序结果:" + JSON.stringify(arr);
    },
};
function del() {
    alert("执行了del事件")
}
var sortable1 = Sortable.create(g1, ops1);