内容拖拽

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'));
});*/

 

你可能感兴趣的:(内容拖拽)