bootstrap-input-spinner
bootstrap-input-spinner copied to clipboard
Dynamic step while holding down button
When holding down the plus or minus button on a spinner and changing the step based on its input event value, it does not use the new step value but the one it started with. You have to let go of the button for the new step value to be used.
<input id="spinner" value="15" min="1" max="1000" step="5" type="number" autocomplete="off">
$("input[type='number']").inputSpinner();
const inputSpinner = $("#spinner");
function spinnerChange() {
const value = Number(inputSpinner.val());
if (value >= 1 && value <= 15) {
inputSpinner.attr("step", 1);
} else if (value >= 15 && value <= 250) {
inputSpinner.attr("step", 5);
} else if (value >= 250) {
inputSpinner.attr("step", 25);
}
}
inputSpinner.on('input', spinnerChange);
inputSpinner.on('change', spinnerChange);
Though this may not be the best solution. In the example above, when the value is exactly 15, I would want it to use a step of 1 if using minus and a step of 5 if using plus and I'm not sure if there is way to get the held direction.