带有/递增值的可排序列表

时间:2014-04-11 16:01:58

标签: jquery jquery-ui

这是我的小提琴:

http://jsfiddle.net/WV8du/24/

我希望根据列表中项目的值/数量来增加/减少数字。感谢您的帮助/提示。

$(function () {
    $("#sortable-primary").sortable({
        placeholder: "ui-state-highlight",
        connectWith: ".connected-sortable"
    });
    $("#sortable-secondary").sortable({
        placeholder: "ui-state-highlight",
        connectWith: ".connected-sortable"
    });
    $("#sortable-primary, #sortable-secondary").disableSelection();
});

1 个答案:

答案 0 :(得分:1)

我认为您需要将这些项目放在一个UL中,这肯定会使它不那么复杂。我没有完全清理CSS,但我认为这会让你开始。这至少是一种解决方案。

function numberLi(){
  var i = 1;
  $('#sortable-primary > .ca-nav-move > .num').each(function(){
    $(this).text(i);
    i++;
  });

  $('#sortable-secondary > .ca-nav-move > .num').each(function(){
    $(this).text("");
  });
}

Here is the fiddle

Here is an updated fiddle,这会在拖动时删除底部列表中的数字。

我不喜欢跟随项目拖动数字的方式,我决定我可以做得更好。 Here is a 3rd fiddle完全以您希望的方式执行。请将此标记为已接受的答案。