如何在表格中拖动列

时间:2015-07-22 02:28:23

标签: javascript jquery html css

Jquery的

 $('a').draggable({
        containment: "table",
        revert: 'invalid'
    });
    var i = 0;
    $('td').droppable({
        drop: function (ev, ui) {
            var dropped = ui.draggable;
            var droppedOn = $(this);
            $(droppedOn).droppable("disable");
            $(dropped).parent().droppable("enable");
            $(dropped).detach().css({
                top: 0,
                left: 0
            }).appendTo(droppedOn);
        }
        });
     $('td').not('td:empty').droppable("disable");
     $('#red').droppable({
            drop: function(ev, ui) {
              dropped = ui.draggable;
              droppedOn = $(this);

              if ( $(droppedOn).droppable()){
                  i++;
              }else{
                  i--;
              }
              if (i==3){
              $(droppedOn).droppable("disable");
              $(dropped).parent().droppable("enable");
              $(dropped).detach().css({top: 0, left: 0}).appendTo(droppedOn);
              }else{
                 $(droppedOn).droppable("enable");
              }
            },
            out: function(event, ui) {
            i=i-1;
            }
        }); 

小提琴:https://jsfiddle.net/uo8x5ks2/

当我拖动时,我正试图让红色背景与T一起移动。 现在它只让我拖动T 谢谢你的时间

1 个答案:

答案 0 :(得分:0)

你可以看一下这个插件。它真的很容易使用。

http://bevacqua.github.io/dragula/