代码之家  ›  专栏  ›  技术社区  ›  griegs

jquery可以跨列拖动,但不能跨行拖动

  •  1
  • griegs  · 技术社区  · 14 年前

    所有项目都从第1列开始,有些在第1行,有些在第2行。

    现在,第一行中的项只能拖到同一行的列中,第二行中的项也只能拖到同一列中。

    有很多拖放插件在那里,但没有我见过的,让我这样做。

    就像一个敏捷的计划板,如果你用过的话

    或者是否有一个插件,我可以使用它只移动到某个特定名称的元素?

    1 回复  |  直到 6 年前
        1
  •  2
  •   Simen Echholt    14 年前

    使用jqueryui,为表中的每一行指定它是哪一行,并使用 accept 选择 droppable 限制特定的 draggable

    在这个例子中 div td tr 有吗?是的 id 属性设置为 row-x 哪里 x 接受

    $("div").draggable({ revert: 'invalid' });
    
    $("td").droppable({
        accept: function(draggable) {
            var droppable_row = $(this).parent().attr("id").split("-")[1];
            var draggable_row = draggable.parent().parent().attr("id").split("-")[1];
    
            return droppable_row == draggable_row;
        }
    });
    

    下面是一个演示: http://jsfiddle.net/EHA46/