Drop и resize, похоже, не работают после первого изменения размера с помощью jQuery

доброе утро dev ':-)

Если я вытащу мышью после первого изменения размера, я больше не могу изменять размер... И после этого первого изменения размера я тоже не могу удалить этот div...

Я использую Laravel и jQuery.

См. Демонстрацию jsFiddle

Я хотел бы иметь возможность изменять размер снова и снова...

Здесь JS-код (jsFiddle покажет вам весь код):

$("#creneau"+i+"-"+j).droppable({
 appendTo: "body",
 tolerance: "pointer",
 accept: ".external-event",
 drop: function(event, ui) {
 var draggableEvent = null;
 if($(ui.draggable).hasClass("cloneable")){
 var drg = ui.draggable.clone();
 $(drg).addClass("moveable");
 $(drg).removeClass("cloneable");
 drg.resizable({
 handles: 'e, w',
 resize: function(event, ui) {
 $(this).empty();
 $(this).append($(this).position().left);
 $(this).append("");
 $(this).append("");
 }
 });
 drg.draggable({
 appendTo: "#hours-creneau",
 cursor: "move",
 helper: 'clone',
 revert: "invalid"
 });
 draggableEvent = $(ui.draggable);
 }else if($(ui.draggable).hasClass("moveable")){
 $(this).append($(ui.draggable));
 draggableEvent = $(ui.draggable);
 }
 $(this).append(drg);
 }
});

И html:

<div id="external-events">

 <h4>Draggable States</h4>

 <span>State1</span>
 <span>State2</span>
 <span>State3</span>
 <span>State4</span>

 </div>
 <div id="tables-events">

 <div id="hours-creneau">
 
 
 </div>
 </div>

Большое спасибо !

РЕДАКТИРОВАТЬ: ОТВЕТ НА СЕБЯ

Я еще не могу отправить ответ, но я редактирую это сообщение:

Во-первых, при изменении размера div, кажется, добавляет "верхний, левый и абсолютный css". Поэтому я удалил левый и верхний, с:

$(this).css("top", "");
$(this).css("left", "");

и снова отбрасывается после изменения размера.

И для изменения размера после первого изменения размера это было связано с тем, что я добавляю текст в div... Не знаю, почему, но он "сломал" изменяемое событие.

Спасибо, ребята, что пытались мне помочь.

1 ответ

Я ответил сам, я разделяю ответ.

Во-первых, при изменении размера div, кажется, добавляет "верхний, левый и абсолютный css". Поэтому я удалил левый и верхний, с:

$(this).css("top", "");
$(this).css("left", "");

и снова отбрасывается после изменения размера.

И для изменения размера после первого изменения размера это было связано с тем, что я добавляю текст в div... Не знаю, почему, но он "сломал" изменяемое событие.

Спасибо, ребята, что пытались мне помочь.

licensed under cc by-sa 3.0 with attribution.