Jquery重新排序列表不能在手机上工作

Question

我有一个列表，我想用jquery重新排序。这在桌面上工作得很好，但在移动设备(iphone)上，它不做重新排序。这是我的代码:

<div class="quick-action-list">
    <a class="alpha">Sort A to Z</a> <a class="alpha_reverse" style="display:none;">Sort Z to A</a>
  <ul>
    <li><a title="A" href="">A</a></li>
    <li><a title="B" href="">B</a></li>
    <li><a title="C" href="">C</a></li>
    <li><a title="D" href="">D</a></li>
    <li><a title="E" href="">E</a></li>
    <li><a title="F" href="">F</a></li>
    <li><a title="G" href="">G</a></li>
    <li><a title="H" href="">H</a></li>
  </ul>
</div>

我jquery:

$('.quick-action-list .alpha').on('click', function () {
        var $actions = $(this).closest(".quick-action-list").find("ul li");
        var alphabeticallyOrderedActions = $actions.sort(function (c, d) {
            return $(c).find("a").text() > $(d).find("a").text();
        });
        $(this).closest(".quick-action-list").find("ul").html(alphabeticallyOrderedActions);
        $(this).closest(".quick-action-list").find('.alpha_reverse').show();
        $(this).hide();
    });
    $('.quick-action-list .alpha_reverse').on('click', function () {
        var $actions = $(this).closest(".quick-action-list").find("ul li");
        var alphabeticallyOrderedActions = $actions.sort(function (c, d) {
            return $(c).find("a").text() < $(d).find("a").text();
        });
        $(this).closest(".quick-action-list").find("ul").html(alphabeticallyOrderedActions);
        $(this).closest(".quick-action-list").find('.alpha').show();
        $(this).hide();
    });

而不是点击我尝试('click touchstart')或只是('touchstart')，但这也不起作用。它可以正确地切换<a>，但它不会重新排序列表。

代码如下:https://jsfiddle.net/06e4g53h/1/

我的问题是，为什么touchstart(或click)切换链接，但实际上没有重新排序列表?

Answer 1

你没有正确使用Javascript的。sort()函数。它应该返回整数，而不是true/false。

不是

var alphabeticallyOrderedActions = $actions.sort(function (c, d) {
  return $(c).find("a").text() < $(d).find("a").text();
});

试

var alphabeticallyOrderedActions = $actions.sort(function (c, d) {
  return $(c).find("a").text() < $(d).find("a").text() ? -1 : $(c).find("a").text() > $(d).find("a").text() ? 1 : 0;
});

查看更新的小提琴以及:https://jsfiddle.net/06e4g53h/3/