一、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配合使用

Droppable(放置组件)的更多相关文章

  1. jQuery Easy UI Droppable(放置)组件

    Droppable(放置)组件也是一个基本组件,使用方法较简单,语法都在样例里面凝视了: 演示样例: <!DOCTYPE html> <html> <head> & ...

  2. droppable放置组件

    Droppable 放置组件 所谓放置,就将一个事物入一个事物内触发各种效果,这个组件不依赖于其他组件.1.加载方式 //class 调用 <div id="dd" clas ...

  3. 第一百九十四节,jQuery EasyUI,Droppable(放置)组件

    jQuery EasyUI,Droppable(放置)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Droppable(放置)组件的使用方 ...

  4. Droppable(放置)组件

    .加载方式 //class 加载方式 <div id="dd" class="easyui-droppable" data-options="a ...

  5. EasyUI系列学习(四)-Droppable(放置)

    一.创建组件 1.使用标签创建一个放置区 <div id="pox" class="easyui-droppable" style="width ...

  6. Tree( 树) 组件[4]

    本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件.一.方法列表 //部分方法onClick : funct ...

  7. Tree( 树) 组件[3]

    本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件.一. 事件列表很多事件的回调函数都包含'node'参数, ...

  8. Tree( 树) 组件[2]

    本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件.一. 异步加载如果想从数据库里获取导航内容, 那么就必须 ...

  9. Tree( 树) 组件[1]

    本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖动)和 Droppable(放置)组件. 一. 加载方式//class 加载方式<ul c ...

随机推荐

  1. rmdir -删除空目录

    总览 rmdir[options]directory... POSIX 选项: [-p] GNU 选项(缩写): [-p] [--ignore-fail-on-non-empty] [--help] ...

  2. Jade To Pug过程中的一个小问题

    最近在使用jade+express+typescript搭建一个博客项目,在使用jade-bootstrap项目时出现了一个问题 在使用其中的carousel时,发现其中的变量并没有转义 +carou ...

  3. 第四章 走进jVM

    4.1字节码 java文件编译成字节码后由默认解释执行,热点代码编译执行.方法调用到一定程度的时候,进行JIT编译成机器码执行,后面直接运行JIT编译结果(机器码). 4.2类加载过程 加载链接初始化 ...

  4. Sass:字符串函数-To-upper-case()、To-lower-case()

    1.To-upper-case() To-upper-case() 函数将字符串小写字母转换成大写字母.如: //SCSS .test { text: to-upper-case(aaaaa); te ...

  5. JVM内存组成

    JVM的内存区域模型 1.方法区 也称永久代.非堆. 用于存储虚拟机加载的类信息.常量.静态变量,是各个线程共享的内存区域. 默认最小值为16MB,最大值为64MB,可以通过-XX:PermSize和 ...

  6. 并行流水线--求 (B+C)*B/2

    public class Msg { public double i; public double j; public String orgStr = null; } import java.util ...

  7. 大数据之hadoop框架知识

    https://blog.csdn.net/zytbft/article/details/79285500

  8. 25-Node.js学习笔记-express-app.locals对象

    app.locals对象 将变量设置到app.locals对象下面,这个数据在所有的模板中都可以获取到 app.locals.users=[{ name:'柠檬不酸', age:20 },{ name ...

  9. 51nod 1384:全排列(STL)

    题目链接 记住next_permutation函数的用法,另外string在这里比char[]慢好多啊.. //#include<bits/stdc++.h> //using namesp ...

  10. 对于vue绑定的model值里边get和set的小动作

    先看下例子: template里边内容: <el-form-item label="导航条类型"> <el-radio-group v-model="n ...