我如何使动态创建的元素draggable（）？ [英] how do i make dynamically created elements draggable()?

问题描述

我正在试图弄清楚如何使动态创建的div可拖动，所以我创建了这个非常简单的东西帮助我。我知道我必须使用非动态处理程序的on（）事件。通过让body元素处理链接的JSfiddle中的克隆事件，我成功地使动态创建的div克隆，但它们不可拖动。我究竟做错了什么？

I'm trying to figure out how to make dynamically created divs draggable, so I've created this very simple thing to help me. I understand that I have to use the on() event with a non-dynamic handler. By having the body element handle the cloning event in the linked JSfiddle, I've succeeded in making the dynamically created divs clonable, but they are not draggable. What am I doing wrong?

提前感谢您的帮助！

$(document).ready(function () {
    $("body").on('click', '.pink', function () {
        $('.container').append($("<div class='bl pink'></div>"))
    });
    $("body").on('click', '.blue', function () {
        $('.container').append($("<div class='bl blue'></div>"))
    });
    $("body").on('click', '.coral', function () {
        $('.container').append($("<div class='bl coral'></div>"))
    });
    $(".draggable").draggable();
});

推荐答案

在创建时把类设为draggable或id在元素中。 （你没有上课）然后代码应该工作

at time of creation put class "draggable" or id in the element. (you are not putting class) and then code should work

$('.container').append($("<div class='bl pink draggable'></div>"));
$('.draggable').draggable() 

这篇关于我如何使动态创建的元素draggable（）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！