当我单击制作排序（ab）数组然后再次单击排序（ba）时，如何制作单击按钮

Question

这是我的问题当我单击 make array.sort(xy) 然后再次单击以 make array.sort(yx) 时，如何制作单击按钮

我已经有 function 但我很困惑如何去做......

让我澄清一下我的问题：我什么时候点击按钮，我对数组进行排序，从大到小，然后我想按下同一个按钮，使数组从小到大排序

这是我的代码：

$(".lower").click(() => {
    colorsValueMenu("highest", "spot", "gainers", "losers", "lower")
    highest = arrayCoinsD.sort(function (a, b) { return b.quote.USD.percent_change_24h - a.quote.USD.percent_change_24h })
    createCoinDiv(arrayCoinsD, arrayCoinsI)
    $(".lower").click(() => {
        colorsValueMenu("lower", "spot", "gainers", "losers", "highest")
        lower = arrayCoinsD.sort(function (a, b) { return a.quote.USD.percent_change_24h - b.quote.USD.percent_change_24h })
        createCoinDiv(arrayCoinsD, arrayCoinsI)
    })
})

这是工作，但只是在第一次和第二次......我想让它像每一次点击的 toggleClass 动作

Answer 1

你应该让你的代码DRY (Don't Repeat Yourself)

您可以创建一个flag并根据flag更改操作：

let flag = "high";

$(".lower").click(() => {
  //   Highest
  colorsValueMenu(
    flag === "high" ? "highest" : "lower",
    "spot",
    "gainers",
    "losers",
    "lower"
  );
  highest = arrayCoinsD.sort(function (a, b) {
    return flag === "high"
      ? b.quote.USD.percent_change_24h - a.quote.USD.percent_change_24h
      : a.quote.USD.percent_change_24h - b.quote.USD.percent_change_24h;
  });

  createCoinDiv(arrayCoinsD, arrayCoinsI);
  flag = flag === "high" ? "low" : "high";
});

Answer 2

您现在正在做的是在#lower 上创建一个事件侦听器。 这将像您要求的那样执行 sort(ab)，但是在该事件侦听器中，您正在创建另一个事件侦听器，这将不起作用。 您可以做的是在建议的评论中创建一个像某人一样的标志。 一个例子是：

flag = false;
("#lower").click(() => {
    flag = !flag;
    if (flag) {
        //do this thing;
    } else {
        //do this other thing;
    }
}

这样，每当您单击它时，行为就会交替出现。 然后，您可以使用它以不同的方式进行排序。

Answer 3

您可以使用toggle方法进行升序，当您再次单击时降序如下：

$(".lower").toggle(function(){
    // Ascending code or function
}, function (){
    // Descending code or function
})

在此处查看官方参考： https://api.jquery.com/toggle-event/