嵌套可排序新添加的项目不会移动

nestedSortable newly added item does not move

本文关键字：项目 移动 添加 排序 新添加 嵌套      更新时间：2023-09-26
var menu = $("ol.menu").nestedSortable({
            handle: '.move',
            items: 'li',
            placeholder: 'placeholder',
            opacity: 0.7,
            toleranceElement: '> i',
            connectWith: 'ol',
            isTree: true,
        }).disableSelection();
        $('#addMenu').on('click',function(){
            var text = $('#menuText').val();
            var link = encodeURIComponent($('#menuLink').val()); 
            if(text != '' && link !=''){
                var html = $('<li id="menu_'+(parseInt(menu.children.length)+2)+'" class="mjs-nestedSortable-leaf">')
                            .append($('<i class="glyphicon glyphicon-move">'),
                                    '&nbsp;'+text+' - '+link,
                                    $('<span class="remove-btn removeMenu">')
                                        .append('<i class="glyphicon glyphicon-minus">'),
                                    $('<ol>')                                        
                            );
                menu.append($(html));
                menu.nestedSortable('refresh');
                console.log(menu.nestedSortable('toArray'));
                $('#menuText').val('');$('#menuLink').val('');
            }else{
                alert('Menü Başlığı ve link boş bırakılamaz!');
            }
        });

我已经把我能找到的都红了。但一切都没有改变。我正在向列表中添加新项目，但无法将其移动到可排序容器内。页面加载附带的元素很好，它们是可移动的。如何实现它。

我红了这个 ->嵌套可排序的动态项目没有折叠

我无法使func"nextId"工作。

我怀念什么。

坦斯克

我认为这是你的问题：文档中的所有代码在加载页面时都可以工作。但是当你附加一些东西时，它不起作用！最简单的方法是：

你应该在你的代码中添加这样的东西：

<div id="addmenu" onclick="yourfunction()" > </div>

.js： 

 function yourfunction(){
        var text = $('#menuText').val();
        var link = encodeURIComponent($('#menuLink').val()); 
        if(text != '' && link !=''){
            var html = $('<li id="menu_'+(parseInt(menu.children.length)+2)+'" class="mjs-nestedSortable-leaf">')
                        .append($('<i class="glyphicon glyphicon-move">'),
                                '&nbsp;'+text+' - '+link,
                                $('<span class="remove-btn removeMenu">')
                                    .append('<i class="glyphicon glyphicon-minus">'),
                                $('<ol>')                                        
                        );
            menu.append($(html));
            menu.nestedSortable('refresh');
            console.log(menu.nestedSortable('toArray'));
            $('#menuText').val('');$('#menuLink').val('');
        }else{
            alert('Menü Başlığı ve link boş bırakılamaz!');
        } }

我真的很愚蠢。我刚刚忘记了动态变量 html :( 中句柄的类名"move"。我现在解决了。

相关文章：