как клонировать событие перетаскивания, используя jquery и jquery-ui - PullRequest
0 голосов
/ 14 марта 2010

Я хочу создать новый '.b' div appendTo document.body,

и он может перетаскиваться как его отец,

но я не могу клонировать событие перетаскивания,

как это сделать,

спасибо

это мой код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
    <head> 
        <meta name="viewport" content="width=device-width, user-scalable=no"> 
    </head> 
<body> 
        <style type="text/css" media="screen"> 

        </style> 

        <div id="map_canvas" style="width: 500px; height: 300px;background:blue;"></div>

        <div class=b style="width: 20px; height: 20px;background:red;position:absolute;left:700px;top:200px;"></div>

        <script src="jquery-1.4.2.js" type="text/javascript"></script>
        <script src="jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script>
        <script type="text/javascript" charset="utf-8"> 
$(".b").draggable({
    start: function(event,ui) {
        //console.log(ui)
        //$(ui.helper).clone(true).appendTo($(document.body))
        $(this).clone(true).appendTo($(document.body))//draggable is not be cloned,
        }
    });
$("#map_canvas").droppable({
drop: function(event,ui) {
    //console.log(ui.offset.left+'   '+ui.offset.top)
    ui.draggable.remove();
    }
});
        </script> 
    </body> 
</html>

Ответы [ 2 ]

0 голосов
/ 14 марта 2010

Похоже, то, что вы пытаетесь сделать, это "вернуть" .b обратно на свое первоначальное место после удаления. Попробуйте сделать это:

$(".b").draggable({
    revert: true,
    revertDuration: 0
});
$("#map_canvas").droppable({
    drop: function(event,ui) {
        //console.log(ui.offset.left+'   '+ui.offset.top)
    }
});
0 голосов
/ 14 марта 2010

Глубокое копирование не будет работать с клоном, попробуйте использовать JQuery Live

$(".b").live("draggable", function() { 
//impl 
});

Живое событие означает, что каждый созданный объект будет проверен, если селектор совпадает, и будет добавлено событие.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...