表格行大小不同的拖放问题 [英] drag and drop problem with different size of table rows

问题描述

我的代码如下所示，它适用于拖放.但是可拖动的行大小大于可拖放的行大小，这不起作用..你能告诉我如何克服这个问题吗?

My code is something like below,it is working for drag and drop.but draggable row size is bigger than droppable row size its not working..can you tell me how to over come on this problem.

$(".Termtr").draggable({
               helper: function(event, ui) {
                   var ret = jQuery(this).clone();
                   var width = jQuery(this)[0].offsetWidth;
                   var myHelper = [];
                   myHelper.push('<table style="width:' + width + 'px;">');
                   myHelper.push(ret.html());
                   myHelper.push('</table>');
                   helper = myHelper.join('');
                   return helper;
               },
               axis: 'y',
               revert: "invalid",
               refreshPositions: true
           });
           $(".Termtr").droppable({
               accept: ".Termtr",
               drop: function(event, ui) {
                   alert($(this));
                   var draggable = ui.draggable, droppable = $(this);
                   var Status1 = $(droppable).data('status');
                   var Status2 = $(draggable).data('status');
                   if (Status1 == Status2) {
                       draggable.swap(droppable);
                   }
               }
           });

推荐答案

(" ).draggable({ 助手:功能(事件，用户界面){ var ret = jQuery( this ).clone(); var width = jQuery( this )[ 0 ].offsetWidth; var myHelper = []; myHelper.push(' <表样式="width:' + width + px;">'); myHelper.push(ret.html()); myHelper.push(' </table>'); helper = myHelper.join(' '); 返回帮助器； }， 轴:' y'， 恢复:" ， refreshPositions: true });

(".Termtr").draggable({ helper: function(event, ui) { var ret = jQuery(this).clone(); var width = jQuery(this)[0].offsetWidth; var myHelper = []; myHelper.push('<table style="width:' + width + 'px;">'); myHelper.push(ret.html()); myHelper.push('</table>'); helper = myHelper.join(''); return helper; }, axis: 'y', revert: "invalid", refreshPositions: true });

(" ).droppable ({ 接受:" ， 放置:功能(事件，用户界面){ alert(

(".Termtr").droppable({ accept: ".Termtr", drop: function(event, ui) { alert(

(此)); var draggable = ui.draggable，droppable =

(this)); var draggable = ui.draggable, droppable =

这篇关于表格行大小不同的拖放问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！