javascript - 将 jQuery UI 滑块添加到动态生成的元素？

Question

所以我使用 .append() 将列表元素添加到列表中。在附加元素中是一个 div，我需要将 jQuery Slider 小部件附加到。不确定我是否必须使用 .on() 或其他东西。FWIW，可以添加无限量的 li，这就是为什么我使用 div 类。

无论如何，这是一个简化的片段：

    $('.cycleDuration').slider();

    $cycleBlock += '<li>';
    $cycleBlock += '<div class="cycleDuration"></div>';
    $cycleBlock += '</li>';
    $('#cycles').append($cycleBlock);

Answer 1

我认为您需要在实际附加元素之前绑定代码。在此示例中，我只是绑定了一个单击事件，因为我没有您的滑块代码。

http://jsfiddle.net/4vwUd/1

$('button').click( function() {
    //turn your div into a jquery object
    var $cycleBlock = $('<div class="cycleDuration"></div>');
    //bind the event
    $cycleBlock.bind('click', function() { alert(); });
    //append to the list
    $('#cycles').append('<li />').children('li:last').append($cycleBlock);
});

Answer 2

您只需在每次添加列表元素后重新调用“$('.cycleDuration').slider();”，这会将添加的类元素绑定到该函数。