Jquery 不使用拖放方式上下排序列表项

我希望用户能够对单击事件的列表重新排序。这是我的密码：

$（函数（）{
$（'#重新排序li'）。每个（函数，（索引）{
$（this.attr（'id'，索引）；
});
$（“#重新排序”）。委托（“li”，“单击”，函数（）{
var$indexItem=$（this）.index（“#reOrder li”）；
var$thisTxt=$（this.text（）；
var$prevTxt=$（this.prev（'li'）.text（）；
$（$thisTxt）.replaceWith（$prevTxt）；
//警报（$thisTxt）；
//警报（$TXT）；
});
});


项目1
项目2
项目3
项目4
您可能想查看的内容是

如果您只是想通过单击等移动项目，请查看以下方法：

作用

功能

$("document").ready(function() {
    $("#reOrder li").click(function() {
        var index = $("#reOrder li").index(this);
        if (index != 0) {
           // li item is not sitting in the first position
           $("#reOrder li:eq(" + (index - 1) + ")").before(this);
        }
    });
});

“分离”将允许您从DOM中删除单击的元素，并且将有一个可用的副本，然后您可以使用其中一个DOM插入函数重新插入到所需的位置

$(function() {
  var $ul = $('ul');
  $ul.css({ position: 'relative', height: $ul.height(), width: $ul.width() });

  $ul.find('>*').each(function(i, e) {
    var $e = $(e);
    $e.data($e.position());
  }).each(function(i, e) {
    var $e = $(e);
    $e.css({ position: 'absolute', top: $e.data('top'), left: $e.data('left') });
  }).click(function(e) {
    var $e = $(e.target);
    var $be = $e.prev();
    if (!$be.length) return;
    $be.before($e).stop().animate($e.position());
    $e.stop().animate($be.position());
  });
});

“哪些是非必需的”-您是指“非必需”还是“禁止”？拖放非常直观，也适用于可触摸设备（我希望-我没有尝试过）。对不起，我的意思是拖放功能不是这里的要求。我认为这将是理想的，并增加价值，但客户希望它的功能与点击链接，移动项目上下。这是伟大的。现在已更新，但希望解除第一个li上的click事件的绑定，以在我单击第一个项目时停止删除它们。嗨，Ryan，请看一看示例函数（上面），它检查索引0处的项目，以确保它没有尝试在该项目上调用before（）。