zoukankan      html  css  js  c++  java
  • 内容拖拽

    function dragTo(eles, _target){
        var id        ='';
        var words    = ['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z'];
        var target_is_leave = false;
        eles.each(function(i){
            id = $(this).attr('id');
            if(!id){
                id = 'drag'+words[Math.floor(Math.random()*26)] + words[Math.floor(Math.random()*26)] + words[Math.floor(Math.random()*26)] + i;
                $(this).attr('id', id);
            }
    
            $(this).attr('draggable','true');
    
            this.ondragstart = function(ev){
                ev.dataTransfer.setData("targetid",ev.target.id);
            };
        });
    
        _target.get(0).ondrop = function(ev){
            var targetid = ev.dataTransfer.getData("targetid");
            var t_clone  = $('#'+targetid).clone();
            t_clone.removeAttr('id').addClass('t_clone');
            _target.append(t_clone);
            ev.preventDefault();
            ev.stopPropagation();
        };
    
        _target.get(0).ondragover = function(ev){
            ev.preventDefault();
            ev.stopPropagation();
        };
    
        _target.get(0).ondragenter = function(ev){
            target_is_leave = false;
        };
    
        _target.get(0).ondragleave = function(ev){
            target_is_leave = true;
        };
    
        $('body').get(0).ondragend = function(ev){
            if($(ev.target).hasClass('t_clone') && target_is_leave==true){
                $(ev.target).remove();
            }
        };
    }
    
    /*$(document).ready(function(){
        dragTo($('.aa'), $('#div1'));
    });*/
  • 相关阅读:
    ETL概述
    POI操作Excel常用方法总结
    段的创建表user_segments
    定位导致物化视图无法快速刷新的原因
    在shell脚本中调用sqlplus
    Oracle 字符集的查看和修改
    Java Web发布
    JSP搭建
    完全卸载oracle11g步骤:
    剑指offer——二叉排序树(BST)、平衡二叉树(AVL)
  • 原文地址:https://www.cnblogs.com/tujia/p/5993786.html
Copyright © 2011-2022 走看看