Question

我有表并使用jquery拖放来交换每个td的值与其他。我使用以下方法做到了这一点：

        $("#a tr td").draggable({
            appendTo: "body",
            helper: 'clone',
            cursor: "move",
            revert: "invalid"
        });


        $('#a tr td').droppable({
           accept: function(ui, item) {
           if($(this).html().trim().length != 0)
              return false;
       },

           drop:function (event, ui ) {
             $(this).append(ui.draggable.text());
             var draggableId = ui.draggable.attr("class");
             var droppableId = $(this).attr("class");
         $( "ui.draggable" ).switchClass( "draggableId", " droppableId");
        //$(this).switchClass( "droppableId", "draggableId");
             $(ui.draggable).empty();

       }
       });  `

但是从上面我可以只交换与td相关的值，但是我想要改变与TD元素相关联的类名。我试过switchClass但没有运气。请建议我实现此方法。

演示：http://jsfiddle.net/ggbhat/BLJFp/3/

在小提琴中你可以看到数字可以交换，我想要改变背景颜色（通过交换类名）。

Answer 1

在你的drop函数中，你可以像这样交换类属性：

drop: function (event, ui)
{
    var draggable      = $(ui.draggable)
      , droppable      = $(this)
      , draggableClass = draggable.attr('class')
      , droppableClass = droppable.attr('class');

    droppable.append(draggable.text());
    draggable.attr('class', droppableClass);
    droppable.attr('class', draggableClass);
    draggable.empty();
}

查看更新后的Fiddle here。

使用jquery拖放在drop上交换drappable的类名和droppable

1 个答案: