Javascript jQueryUI:表及其行中的可拖动和可拖放(不触发)
我目前正在使用jqueryui中的Draggable来拖动表中的选定行。但是,当我试图在某些表行上使用Droppable时,即使类Javascript jQueryUI:表及其行中的可拖动和可拖放(不触发),javascript,jquery,jquery-ui,draggable,droppable,Javascript,Jquery,Jquery Ui,Draggable,Droppable,我目前正在使用jqueryui中的Draggable来拖动表中的选定行。但是,当我试图在某些表行上使用Droppable时,即使类ui Droppable添加到这些特定行中,也不会触发任何事件。请注意,表是动态创建的,但我正在创建的事件都是在呈现表时创建的 到目前为止,这一切都很好: $(".files") //this is the class of tbody .draggable({ handle: ".selected",
ui Droppable
添加到这些特定行中,也不会触发任何事件。请注意,表是动态创建的,但我正在创建的事件都是在呈现表时创建的
到目前为止,这一切都很好:
$(".files") //this is the class of tbody
.draggable({
handle: ".selected",
start: function () {
amDragging = true;
},
drag: function (evt) {
$('.files .template-folder:not(.selected)').addClass('drag-over');
},
helper: function (ui) {
var endReturn = '<div>';
$('.selected').find('.name').each(function (index, element) {
endReturn = endReturn + ' ' + $(this).text();
});
amDragging = true;
console.log(amDragging);
return endReturn + '</div>';
},
cursorAt: {
top: -10,
left: -10
},
scroll: false,
stop: function (evt) {
$('.files .template-folder').removeClass('drag-over');
}
});
基本上,我正在尝试做的是,将类.selected
中的行拖动到类.template文件夹中的行上,并在完成后触发一个事件。我缺少的代码有什么问题吗,或者有简单的解决方法吗
我曾尝试在模板文件夹
上绑定dragover
,但这不会触发Dragable,只会触发拖动文本等
这是表格html的外观:
任何帮助都将不胜感激,因为我真的被困在这个问题上。如果您想在表元素上使用ui,您应该使用它
ui助手:'clone',这将使元素位置:绝对
注意:默认ui拖动是相对位置的,表元素不支持相对位置
Try:activeClass选项
它可能会解决您的问题。如果您想在表元素上使用ui,您应该使用它
ui助手:'clone',这将使元素位置:绝对
注意:默认ui拖动是相对位置的,表元素不支持相对位置
Try:activeClass选项
可能它会解决您的问题。您好,HTML的图像没有多大帮助,因为我们甚至无法复制它。。。尝试在stack snippet或JSFIDLE中制作一个演示,演示问题,以便其他人可以使用it@TJ,嘿,当我回到家的时候,我想试着重新创建这个问题,因为创建表的过程非常复杂,而且大部分都是在PHP中运行的。当我这样做时,我会更新我的问题,谢谢!嗨,HTML的图像没有多大帮助,因为我们甚至不能复制它。。。尝试在stack snippet或JSFIDLE中制作一个演示,演示问题,以便其他人可以使用it@TJ,嘿,当我回到家的时候,我想试着重新创建这个问题,因为创建表的过程非常复杂,而且大部分都是在PHP中运行的。当我这样做时,我会更新我的问题,谢谢!
$(".files .template-folder").droppable({
drop: function(event, ui) {
console.log("dropped");
}
});