jquery - 如何使用 jquery 对图像进行排序？

Question

我正在使用一个滑块，其中根据文件名放置图像，并且我已经像这样命名我的图像

img-1, img-2, img-3, img-4, img-5, img-6, img-7, img-8, img-9, img-10

但是浏览器是这样排序的

img-1, img-10, img-2, img-3, img-4, img-5, img-6, img-7, img-8, img-9

那么如何对我的图像进行排序，以便在我的示例中 img-10 最终会使用 jquery 呢？

score 2 · Accepted Answer

如果您只是想对图像名称进行排序，则可以使用纯 JS 编写自定义排序函数：

sorted = imageNames.sort(function(a, b) { 
      return parseInt(a.split('-')[1], 10) - parseInt(b.split('-')[1], 10) 
});

-这将根据文件名中字符后面的数值进行排序。

score 1 · Accepted Answer

这就是您要寻找的（尼尔注意到没有滑动）。

$('img-selector').click(function(){
  $(this).parent().prepend(this);
});

score 1 · Accepted Answer

排序按字典顺序进行。如果您确定图像小于 99（我的意思是两位数），则最好在数字上添加“0”前缀。

像这样的东西：

"img-01", "img-02", "img-03", "img-04", "img-05", "img-06", "img-07", "img-08", "img-09", "img-10"

要不然

使用字母代替编号系统。

"img-a", "img-b", "img-c", "img-d", "img-e", "img-f", "img-g", "img-h", "img-i", "img-j"

3 回答 3