Question

我想使用2个数据属性对div进行排序。我用这个代码

    feature
[1] abs_deg_sum_1       NumAfterEdits_1     N_1                 NumAfterEdits_3    
[5] TimeSinceLastEdit_2 wt_product_1        NumAfterEdits_2     dwdt_1             
52 Levels: abs_deg_diff_1 abs_deg_diff_2 abs_deg_diff_3 abs_deg_diff_4 ... Z_4



relative_importance
[1] 61.048212 17.235435  1.891542  1.409848  1.356924  1.264824  1.220593  1.184612


library(ggplot2)
df = data.frame(feature, relative_importance)
c <- ggplot(df, aes(x = feature, y = relative_importance, fill = feature)) + geom_bar(stat = "identity")
c + coord_flip()

positions <- c("abs_deg_sum_1", "NumAfterEdits_1", "N_1", "NumAfterEdits_3","TimeSinceLastEdit_2", "wt_product_1", "NumAfterEdits_2",
               "dwdt_1")
c <- c + scale_x_discrete(limits = positions)
c + coord_flip()

我试过这个剧本：

<div class='fff' data-player="77" data-revision="0">Oxlade</div>
<div class="fff" data-player="85" data-revision="0">Draxler</div>
<div class="fff" data-player="80" data-revision="4">Kamara</div>

但它只对数据播放器进行排序而不是数据修订？所以首先他必须对修订进行排序， Kamara应该是排在第一位的，因为他的修改是＆＃39;跟随其他人一样，因为他高于Oxlade和最后的Oxlade

Answer 1

你可以使用.sort（）

$('.fff').sort(function (a, b) {
    return parseInt($(b).attr('data-player')) - parseInt($(a).attr('data-player'));
}).appendTo('body');

Working Demo

注意：此代码将从较高的数据播放器排序到较低的数据播放器

下一个代码将按数据修订

排序

$('.fff').sort(function (a, b) {
   return parseInt($(b).attr('data-revision')) - parseInt($(a).attr('data-revision'));
}).appendTo('body');

Working Demo

进行两次排序（问题更新后）

    $(".fff").sort(function (a, b) {return parseInt($(b).attr('data-player')) - parseInt($(a).attr('data-player'));
    }).sort(function (a, b) {
             return parseInt($(b).attr('data-revision')) - parseInt($(a).attr('data-revision'));
    }).appendTo('body');

Working Demo

Answer 2

正如@ Mohamed-Yousef所提到的，你可以使用.sort()功能，但其他答案中的逻辑有点偏离。

电话应该看起来像......

$('.fff').sort(function (a, b) {
         return  ($(b).data('revision')+ "" + $(b).data('player')) - ($(a).data('revision')+ "" + $(a).data('player'));
    }).appendTo('body');

这是因为做另一个由另一个执行的操作只是运行一个新的排序。您需要进行某种连接才能使排序正常运行。

Working fiddle

如何使用2（！）数据属性对div进行排序？

2 个答案: