0

所以我想知道为什么如果我有一个嵌套列表，例如

<ul id="categories">
  <li> <span class="categoriesSort">[Move]</span>Category
    <ul id="tasks">
      <li><span class="handle">[Move]</span>Task</li>
      <li><span class="handle">[Move]</span>Task</li>
    </ul>
  </li>
  <li> <span class="categoriesHandle">[Move]</span>Category
    <ul id="tasks">
      <li><span class="handle">[Move]</span>Task</li>
      <li><span class="handle">[Move]</span>Task</li>
    </ul>
  </li>
</ul>

第二个类别必须在顶部才能使其任务可编辑.....我可以移动这两个类别。但必须在上面。现在，如果我将第二个类别移动到列表顶部并编辑其任务，然后我可以将其拖到底部并继续编辑任务列表，但如果我刷新页面，则这些任务不再可编辑。

代码

 jQuery(function() {
    return $('#categories').sortable({
      axis: 'y',
      handle: '.categoriesSort',
      update: function() {
        return $.post($(this).data('update-url'), $(this).sortable('serialize'));
      }
    });
  });

  jQuery(function() {
    return $('#tasks').sortable({
      axis: 'y',
      handle: '.handle',
      update: function() {
        return $.post($(this).data('update-url'), $(this).sortable('serialize'));
      }
    });
  });

有什么想法吗？- ajax 请求工作正常。除非第二个类别位于顶部，否则我无法对其任务进行排序。

4

1 回答 1

1

UL您的问题是因为您正在重用#tasks 的 ID 值。

您不能在文档中复制 ID。http://www.w3.org/TR/html401/struct/global.html#h-7.5.2

您看到的原因之一：js 和 css 只会评估它找到的第一个具有该 ID 值的元素，而不是全部。这就是课程的用途。

http://jsfiddle.net/rlemon/xYGsA/这是一个将 ID 更改为类的示例。

于 2012-09-13T15:34:54.483 回答