Пользовательский интерфейс jQuery, перетаскивание не работает должным образом, если параметр помощника установлен на «клон»

Question

Пользовательский интерфейс jQuery, перетаскивание не работает должным образом, если параметр помощника установлен на «клон»

0

когда свойство хелпера перетаскиваемого элемента "клонировано", а затем при отбрасывании его не работает. проверьте пример кода ниже:

    <div  id="clonedDraggableItem" <img src="img\select.png"/></div>
    <div  id="originalDraggableItem" <img src="img\select.png"/></div>

<div id="droppableWorkArea" style="border:1px solid gray; height:475px;width:100px"></div>

<script type="text/javascript">
    $(function () {
        $("#clonedDraggableItem").draggable({opacity: 0.7,helper: "clone"});   
        $("#originalDraggableItem").draggable({opacity: 0.7, helper: "original" });    

        $("#droppableWorkArea").droppable({
            drop: function () {
            }
        });
    });

Но, как вы можете видеть, другой элемент, который не клонирован, а вместо этого свойство "helper" задается "оригинальным", то он работает. Кроме того, этот удаленный элемент можно перемещать по разделительному div.

Обратите внимание: я хочу, чтобы перетаскиваемый элемент (с "клонированием") не просто удалялся, но также мог перемещаться по разделительному div.

ismail baig 20 нояб. 2013, в 05:40

Источник

Теги:

jquery

jquery-ui

drag-and-drop

1 ответ

Ещё вопросы

Trevor · Accepted Answer · 2013-11-22T17-25-00.000Z

Вот один из способов сделать это.

$( "#draggable" ).draggable({
            helper : "clone"
});
$( "body" ).droppable({
    drop: function( event, ui ) {
        $(ui.helper).removeClass('ui-draggable-dragging');
        var newDiv = $(ui.helper).clone().removeClass('ui-draggable-dragging');
        $(this).append(newDiv);
  }  
});

Следующие примеры взяты из другого подобного вопроса, на который я ответил.

http://jsfiddle.net/Jje3H/

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

http://jsfiddle.net/Jje3H/1/

Или, если вы просто хотите, чтобы можно было перемещать последующие клоны, тогда:

http://jsfiddle.net/Jje3H/2/

Спасибо людям, это мне очень помогло. Еще раз спасибо. :)
отличный ответ Тревор. так держать