Question

我正在尝试将HTML代码（通过ajax调用）添加到删除元素的部分，同时这样做我可以追加第一个drop事件但是在重复同一个drop事件的同时我无法添加HTML代码。此外，我希望元素都可以排序，所以我最后调用了一个可排序的函数。

中的以下购物车教程链接进行了操作

这是我的Jquery代码：

nitsbuilder.init = function () {
    var navmenu= $('ul.nitseditormenu').find('li').find('ul').find('li');
    navmenu.draggable({
        connectToSortable: "nitsbuilder.editarea",
        helper: "clone",
        cursor: "move",            
    });

    nitsbuilder.editarea.droppable({
       drop: function (event, ui) {
                nitsbuilder.dropeventhandler(ui.draggable, ui.offset);
       }
    }).sortable({
        revert: true
    });
}();

nitsbuilder.dropeventhandler = function ($item, $position) {
    var nits_id = $item.data('nitsid');
    var i = 0;
    $.ajax({
        method: 'POST',
        url: dropurl,
        data: { nits_id: nits_id, _token: token},
        dataType: 'json',
        success: function (data) {
            if (nitsbuilder.editarea.find('[data-nitsid]').length > 0) {
                nitsbuilder.editarea.children('[data-nitsid]').each(function () {
                    if ($(this).offset().top >= $position.top) {
                        $(data.htmlcode).insertBefore($(this));
                        i = 1;
                        return false;
                    }
                })
            }
            if (i != 1) {
                nitsbuilder.editarea.html(data.htmlcode);
                var datanits = nitsbuilder.editarea.find('[data-nitsid]').length;
                console.log(datanits);
            }
        }
    });
}

请找到问题的最小代码为（JSFiddle）

请帮帮我。感谢。

Answer 1

你应该在动作之后解除绑定并绑定draggable，例如创造元素。我建议使用类选择器。

1恢复功能

$（＆＃34; .selector＆＃34;）。draggable（＆＃34; destroy＆＃34;）;

2再次添加

$（＆＃34; .selector＆＃34;）。draggable（...你想要的......）;

在Jquery中重复操作时附加HTML代码不起作用

1 个答案: