Question

这是html结构。我用li使li可排序。但希望id = type1的列表始终粘贴在一起，而type2分开。并且type2不能在type1

的列表内移动

 <div id="container" class="container">
      <li id="type1" class="type1">Option 1<li>
      <li id="type1" class="type1">Option 2<li>
      <li id="type1" class="type1">Option 3<li>
      <li id="type1" class="type1">Option 4<li>
      <li id="type2" class="type2">Option 5<li>
      <li id="type2" class="type2">Option 6<li>
    </div>

我很困惑如何用jQuery实现这一目标。请帮助。谢谢

Answer 1

我已经尝试使用jQuery UI解决您的问题。下面是代码。希望对您有所帮助。

$('container').sortable()
$('.container-type').sortable()

.type1, .type2{
  display: block;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<div id="container" class="container">
  <ul class="container-type">
    <li id="type1" class="type1">Option 1</li>
    <li id="type1" class="type1">Option 2</li>
    <li id="type1" class="type1">Option 3</li>
    <li id="type1" class="type1">Option 4</li>
  </ul>
  <ul class="container-type">
    <li id="type2" class="type2">Option 5</li>
    <li id="type2" class="type2">Option 6</li>
  </ul>
</div>

jQuery排列可排序，按ID排列

1 个答案: