3 ，拖入，拖出，触发函数 ：

1 ，拖入 ： droppable

1. 目的 ： a 拖到 b 中，进去后，b 变色
2. 代码 ：

//  可拖动
$("#box").draggable()
//  可一作为容器，将其他元素拖入进来
$("#wai").droppable({
    //  接受
    accept:"#box",
    //  进来后，调用函数
    onDragEnter:function (e,source) {
        $(this).css("background","red")
    }
})
<div id="wai" style="height: 500px;width: 500px;background-color: #6a6a6a"></div>
<div id="box" style="height: 50px;width: 50px;background-color: orange">
    <span id="content">内容区域</span>
</div>

2 ，不出发拖动事件 ： disabled:true,

//  可拖动
$("#box").draggable()
//  可一作为容器，将其他元素拖入进来
$("#wai").droppable({
    //  接受
    accept:"#box",
    //  使拖动事件不可用
    disabled:true,
    //  进来后，调用函数
    onDragEnter:function (e,source) {
        $(this).css("background","red")
    }
})

3 ，禁用拖入事件 ：

$("#wai").droppable("disable")

4 ，启用拖入事件 ：

$("#wai").droppable("enable")

5 ，小案例 ： 拖入拖出

//  可拖动
$("#box").draggable()
//  可拖入
$("#wai").droppable({
    //  接受
    accept:"#box",
    //	拖入
    onDragEnter:function (e,source) {
        $(this).css("background","red")
    },
    //	脱出
    onDragLeave:function (e,source) {
        $(this).css("background","blue")
    },
})