点击排序按钮结果每次不同，JS字母排序列表代码问题咨询

嗨，我一眼就看出问题所在啦——你的排序比较函数漏掉了两个元素相等时的返回值！

JavaScript的Array.sort()方法要求比较函数必须明确返回三种值：

• 当a应该排在b前面时返回-1
• 当a应该排在b后面时返回1
• 当a和b相等时返回0

如果没处理相等的情况，浏览器会用不稳定的排序逻辑，导致每次点击排序时，相等元素的位置随机变动，看起来就是结果不一致。

另外还有两个小细节可以优化：一是要阻止链接的默认跳转行为，不然点击后页面刷新会重置排序；二是统一文本的大小写和去除空格，避免大小写（比如"A"和"a"）或前后空格干扰排序结果。

给你修改后的完整代码：

$(document).ready(function() {
  $('a').click(function(e) {
    e.preventDefault(); // 阻止链接默认跳转，避免页面刷新
    var $sort = this;
    var $list = $('#sort-list');
    var $listLi = $('.sort', $list);
    
    $listLi.sort(function(a, b) {
      // 统一处理文本：去除前后空格+转小写，避免大小写/空格影响排序
      var keyA = $(a).find('.item').text().trim().toLowerCase();
      var keyB = $(b).find('.item').text().trim().toLowerCase();
      
      if (keyA < keyB) {
        return -1;
      }
      if (keyA > keyB) {
        return 1;
      }
      // 核心修复：相等时必须返回0，保证排序稳定性
      return 0;
    });
    
    // 将排序后的元素重新添加到列表中
    $list.append($listLi);
  });
});

核心修改点总结：

• 新增e.preventDefault()：避免点击链接后页面跳转丢失排序状态
• 文本预处理trim().toLowerCase()：让排序更精准，不受格式干扰
• 补全return 0分支：确保相等元素的相对位置固定，解决排序结果随机的问题

内容的提问来源于stack exchange，提问作者Vahagn