easyUI droppable组件使用

最新推荐文章于 2024-07-20 23:54:17 发布

weixin_34007291

最新推荐文章于 2024-07-20 23:54:17 发布

阅读量89

点赞数

文章标签： javascript ViewUI

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类型_dragener
            console.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类型_dragleave
            console.log('onDragLeave');
            console.log(e);
        },
        onDrop: function(e) { //e类型_drop
            console.log('onDrop');
            console.log(e);
        }
    };
    $('#pox2').droppable(obj);

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

});

weixin_34007291

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
easyUI droppable组件使用

easyUI droppable组件使用：&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Document&lt;/title&gt; &lt;script src=&q
复制链接

扫一扫