Question

我有2个列表元素

<div id="list-one">
  <ul class="ul-one">
    <li data-order="1">item 1</li>
    <li data-order="2">item 2</li>
    <li data-order="3">item 3</li>
  </ul>
</div>
<br />
<div id="list-two">
  <ul class="ul-two">
    <li data-order="1">item 4</li>
    <li data-order="2">item 5</li>
    <li data-order="3">item 6</li>
  </ul>
</div>

当我使用jQuery Sortable排序ul-two时，ul-one列表元素顺序是否可以按ul-one顺序排列？

我希望得到像

这样的结果

<div id="list-one">
  <ul class="ul-one">
    <li data-order="2">item 2</li>
    <li data-order="1">item 1</li>
    <li data-order="3">item 3</li>
  </ul>
</div>
<br />
<div id="list-two">
  <ul class="ul-two">
    <li data-order="2">item 5</li>
    <li data-order="1">item 4</li>
    <li data-order="3">item 6</li>
  </ul>
</div>

只需拖动ul-one元素

感谢您的回答

Answer 1

很抱歉误解了这个问题。

这是一个有效的解决方案。我将id标记添加到轻松调用

http://jsfiddle.net/39ZvN/1141/

Answer 2

试试这个

<div id="list-one">
  <ul class="sort ul-one">
    <li data-order="1">item 1</li>
    <li data-order="2">item 2</li>
    <li data-order="3">item 3</li>
  </ul>
</div>
<br />
<div id="list-two">
  <ul class="sort ul-two">
    <li data-order="1">item 4</li>
    <li data-order="2">item 5</li>
    <li data-order="3">item 6</li>
  </ul>
</div>


$( '.sort li' ).each(function() {
      var position = $(this).data('order');
      $(this).siblings().eq(position+1).after(this);
});

jQuery UI可排序多元素目标

2 个答案: