Question

我试图用带有jquery sortible的子列表创建一个列表。当我忙于这个时，我遇到了一个问题，当我试图把na li放到另一个li上时，我没有创建一个子列表。

我现在拥有的代码：

public class demo {
    public  static  void main(String args[])
    {
        ProtocolStringList s=new ProtocolStringList() {
            @Override
            public List<ByteString> asByteStringList() {
                return null;
            }

            @Override
            public int size() {
                return 0;
            }

            @Override
            public boolean isEmpty() {
                return false;
            }

            @Override
            public boolean contains(Object o) {
                return false;
            }

            @Override
            public Iterator<String> iterator() {
                return null;
            }

            @Override
            public Object[] toArray() {
                return new Object[0];
            }

            @Override
            public <T> T[] toArray(T[] a) {
                return null;
            }

            @Override
            public boolean add(String s) {
                return false;
            }

            @Override
            public boolean remove(Object o) {
                return false;
            }

            @Override
            public boolean containsAll(Collection<?> c) {
                return false;
            }

            @Override
            public boolean addAll(Collection<? extends String> c) {
                return false;
            }

            @Override
            public boolean addAll(int index, Collection<? extends String> c) {
                return false;
            }

            @Override
            public boolean removeAll(Collection<?> c) {
                return false;
            }

            @Override
            public boolean retainAll(Collection<?> c) {
                return false;
            }

            @Override
            public void clear() {

            }

            @Override
            public String get(int index) {
                return null;
            }

            @Override
            public String set(int index, String element) {
                return null;
            }

            @Override
            public void add(int index, String element) {

            }

            @Override
            public String remove(int index) {
                return null;
            }

            @Override
            public int indexOf(Object o) {
                return 0;
            }

            @Override
            public int lastIndexOf(Object o) {
                return 0;
            }

            @Override
            public ListIterator<String> listIterator() {
                return null;
            }

            @Override
            public ListIterator<String> listIterator(int index) {
                return null;
            }

            @Override
            public List<String> subList(int fromIndex, int toIndex) {
                return null;
            }
        };

        s.add("a");
        s.add("b");
        for(int i=0;i<2;i++)
        {
            System.out.println(s.get(i));//prints null
        }

    }
}

$('.sortable-folder').sortable({
        connectWith: '.sortable-folder',
        dropOnEmpty: true,
        stop: function (event, ui) {
            //var prev = $(ui.item).prev('li').attr('id');
            //var next = $(ui.item).next('li').attr('id');
            $("ul").each(
                function () {
                    var elem = $(this);
                    if (elem.children().length == 0) {
                        elem.parent().removeClass("has-children");
                        elem.remove();
                    }
                }
            );
    }

});

我希望有人能帮助我。

Answer 1

我一直在尝试使用下面的代码...唯一的问题是$(this).sortable('refresh');似乎被提前调用（或根本没调用），因此添加的子列表不是可排序的。

（如果有人知道如何解决这个问题，请随时编辑此答案。）

＆＃13;

$('.sortable-folder').sortable({
        connectWith: '.sortable-folder',
        dropOnEmpty: true,
        start: function(event,ui)
        {
            $(this).find('li').not(':has(ul)').append('<ul class="sortable-folder ui-sortable"><li></li></ul>')
            $(this).sortable('refresh');
        } ,
        stop:  function(event,ui)
        {
            $(this).find('li:empty').remove();
            $(this).find('ul:empty').remove();
            $(this).sortable('refresh');
        }

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<style>
.sortable-folder {
    padding:5px;
    border:1px solid blue;
}
.sortable-folder li {
    padding:5px;
    border:1px solid red;
}
</style>
<div class="col-2-12" id="menu-mappen">
   <ul class="sortable-folder">
    <li class="active"><a id="id1" href="#"><i class="far fa-folder"></i>Afbeeldingen</a></li>
    <li><a id="id2" href="#"><i class="far fa-folder"></i>Producten</a></li>
    <li><a id="id3" href="#"><i class="far fa-folder"></i>Homepage</a></li>
    <li class="has-children"><a id="id4" href="#"><i class="far fa-folder"></i>Bestanden</a>
      <ul class="sortable-folder">
        <li><a id="id5" href="#"><i class="far fa-folder"></i>Afbeeldingen</a></li>
        <li><a id="id6" href="#"><i class="far fa-folder"></i>Producten</a></li>
      </ul>
    </li>
    <li><a id="id7" href="#"><i class="far fa-folder"></i>Afbeeldingen</a></li>
  </ul>

</div>

＆＃13;

如何使用jquery sortible创建子列表

1 个答案: