使用jQuery拖放生成的图像

Question

这是我的代码：

$(document).ready(function() {

    $('#add_btn').click(function() {  
    var src$ = $('#img_loc').val();
    $('<img>').attr({
        src: src$,
        class: 'canDrag'}).appendTo($('#work_area'));
    });

    $('.canDrag').hover(
        function() {
            $(this).addClass('dragMe');
        },
        function() {
            $(this).removeClass('dragMe');
        }
    );

    $('.dragMe').draggable();
    $('.dropSpace').droppable({
        accept:'.dragMe'
    });
});

我想通过点击一个按钮来生成图像，该按钮也可以立即拖动和放置。我已将我的代码链接到jquery和jquery ui（目录路径是正确的）但我仍然无法拖动图像。任何人都可以提供有关这里错误的建议吗？

Answer 1

您应该将可拖动声明更改为：

$('.canDrag').draggable();

在执行此行的阶段，您的图像没有dragMe类，因此它不会被拖动。

您可能希望dragMe类提供可拖动性的可视指示，但实际的可拖动功能可能始终可用。