easyUI droppable组件使用

easyUI droppable组件使用：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><script src="easyui/jquery.min.js"></script><script src="easyui/jquery.easyui.min.js"></script><script src="easyui/locale/easyui-lang-zh_CN.js"></script><script src="js/test004.js"></script><link rel="stylesheet" href="easyui/themes/default/easyui.css"><link rel="stylesheet" href="easyui/themes/icon.css">
</head><body><div id="pox" class="easyui-droppable" data-options="accept:'#box',onDragEnter:function(e,s){console.log('onDrapEnter');}" style="border:1px solid red;width:300px;height:300px">this is container</div><div id="box" class="easyui-draggable" style="border:1px solid black;width:100px">this is children</div><div id="pox2" style="border:1px solid black;width:300px;height:300px">this is container2</div>
</body></html>

$(function(argument) {var obj = {accept: '#box', //接收哪些对象，可以是.className之类的选择器//disabled:true,//禁止放置，但是还是能放上去的，但是事件都不响应了；onDragEnter: function(e) { //e类型_dragenerconsole.log('onDragEnter');console.log(e);},onDragOver: function(e) { //e类型_dragover// console.log('onDragOver');// console.log(e);console.log($(this).droppable('options')); //获取options对象；
        },onDragLeave: function(e) { //e类型_dragleaveconsole.log('onDragLeave');console.log(e);},onDrop: function(e) { //e类型_dropconsole.log('onDrop');console.log(e);}};$('#pox2').droppable(obj);

$('#pox2').droppable('disable'); // 有效果呀；
$('#pox').droppable('disable'); // 有效果呀；

});

easyUI droppable组件使用相关推荐

Easyui主要组件用法
Easyui主要组件用法说明: 1. combogrid用法说明:combogrid可提供翻页列表的数据选择并可进行数据的过滤查询(查询的传人参数为q,可在控制器中获取这个参数传过来的值,下面的示 ...
easyui打开新的选项卡_Jquery Easyui选项卡组件Tab使用详解（10）
本文实例为大家分享了Jquery Easyui选项卡组件的实现代码,供大家参考,具体内容如下加载方式 Class加载 tab1 tab2 tab3 JS调用加载 tab1 tab2 tab3 $(f ...
easyui部分组件使用经验
easyui部分组件使用经验 easyui-switchbutton easyui-tree easyui-datagrid 其他 easyui-switchbutton 需要实现在数据表格中有一列如 ...
jQuery EasyUI Datagrid组件的完整的基础DOM结构
标题可能有点长,什么叫"完整的基础DOM结构",这里"基础"的意思是指这个结构不依赖具体数据,不依赖Datagrid的view属性,只要存在Datagrid实例 ...
网站前端_EasyUI.基础入门.0002.带你玩转jQuery EasyUI Panel组件 ?
简单介绍: 说明: Panel面板常当作其它内容的容器,可用于创建包含Layout布局/Tabs选项卡/Accordion折叠面板等基础组件,还提供了内置的折叠/关闭/最大化/最小化的行为,你可以将它 ...
EasyUI的组件加载两次的问题
用Tabs打开会访问两次,新建一个空的Panel 然后在赋值. 不过这个Bug在最近的EasyUI解决了 $("#btn").click(function() {$("# ...
关于ie中easyui form组件load事件无法多次加载数据
1.废话不多说,既然找到这了就是要解决问题的: 在easyui中form load事件是这样用的的 load data 加载记录来填充表单. data 参数可以是一个字符串或者对象类型,字符串作为一个 ...
网站前端_EasyUI.基础入门.0009.使用EasyUI Layout组件的最佳姿势?
1. 基础布局 <div id="l" class="easyui-layout" data-options="width:500,height ...
EasyUI 自定义组件 icon 图标
前言 EasyUI 自带的 icon 就二十多个(1.3.3版本) 明显是不足的,而且不能很好适应主题,如此一来,自定义 icon 就显得十分重要了步骤 1.准备好图片这里推荐一个挺好的图标库 ...

easyUI droppable组件使用

easyUI droppable组件使用相关推荐

最新文章

热门文章