Как изменить минимальное значение на текущей странице при нажатии кнопки в диапазоне ввода?

Question

Я хочу изменить значение таким образом, когда я нажимаю следующую кнопку на текущей странице.

I wrote the code like this, but it doesn't work at all:

el.delegate(".nextbtn", "click", function (event) {
  const current = $(event.currentTarget) // =.nextbtn
  const currentR = $(".pagination-range")
  let pageNumber = +currentR.val() // =currentPage
  let minV = +currentR.attr("min")
  let maxV = +currentR.attr("max")

  if (self.getTotalPage >= maxV) {
    currentR.attr({
      min: pageNumber,
      max: pageNumber + 4,
    })
  }
})

Что не так с этим кодом? Заранее спасибо.

Answer 1

Вот чистое javascript решение для вас. Я определил свой собственный $ как сокращенную функцию, которая использует querySelector, поэтому она похожа на jQuery.

const $ = (s) => document.querySelector(s);

const rng = $("#rng");
const button = $("#biggerMax");

button.addEventListener("click", () => {
  console.log("adding max value by 4");
  let rngMax = rng.getAttribute("max");
  let newMax = parseInt(rngMax)+4;
  rng.setAttribute("max", newMax );
});

<input id="rng" type=range min=2 max=5 step=1>

<button id="biggerMax">Bigger max</button>