Droppable(放置組件)

一、class加載方式

   <div id="pop" class="easyui-droppable" style="width: 400px;height: 300px;background-color: powderblue"></div>

二、js加載方式

   $("#pop").droppable({}）

三、關於Droppable的屬性、事件、方法

$("#pop").droppable({

   //屬性
      accept:"#box", //值為selector 確定哪些元素被接受 默認為 null
     disabled:true , //，如果為 true，則禁止放置 默認為 false
  //事件
     onDragOver:function (e,source) {$(this).css('background', 'blue')},// 在被拖拽元 素經過放置區的時候觸發
     onDragEnter:function () {} , //在被拖拽元素到放置區內,左鍵未松開的時候觸發
     onDragLeave : function (e, source) {}, 在被拖拽元素離開放置區的時候觸發
     onDrop : function (e, source) {}在被拖拽元素放入到放置區的時候觸發
});
//方法
    //返回屬性對象 $('#box').droppable('options');
   //禁止放置 $('#box').draggable('disable');
  //啟用放置 $('#box').draggable('enable');

四、可以使用重寫默認值對象。​ $.fn.droppable.defaults.disabled = true;

*ps：一般和draggable配合使用