Question

我正在使用jQuery UI进行排名选票，您可以看到示例here。

我想改变它，以便当选民拖动候选人姓名时，名字会移动，但他们旁边的数字却不会。

我知道我可以通过隐藏列表编号并在可排序旁边添加一个单独的，固定的数字列表来实现这一点，但我希望有一个更简单的解决方案。

有任何想法可以轻松实现这一目标吗？

Answer 1

我找到了一种非常简单的方法来实现这一目标。假设这是列表：

<div id="ballot">
<ol id="sortable">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ol>
</div>

然后，以下javascript将在每个列表项的左侧添加一个数字：

window.onload = function(){
  $("#sortable li").each(function(n) {
    var pos = $(this).position();
    var number = document.createElement('p');
    number.innerHTML = (n+1) + ".";
    $(number).css("position", "absolute");
    $("#ballot").append(number);
    $(number).position({
      my: "center",
      at: "left",
      of: this,
      offset: "-15 0"
    });
  });
};

我仍然是一个使用javascript和jQuery的菜鸟，所以我为代码中的任何愚蠢而道歉。

jQuery UI可排序数字不移动

1 个答案: