欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Droppable(放置组件)

程序员文章站 2022-06-16 22:07:12
一、class加载方式
二、js加载方式 $("#pop").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配合使用