为什么.on("click") 触发但.on("scroll") 不用于输入元素？

Question

只是将一个快速范围 slider 放在一起，我希望“进度条”根据输入字段的值变化而移动。 对此的主要控制将是滚轮，但由于某种原因，当我使用.on("scroll") 时什么都没有触发，只是想找出原因。 我花了一段时间才发现我需要存在 onmousewheel="" 属性才能滚动输入值。

 let slideInput = $("#slider-value"); $(document).ready(function() { slideInput.on("click", function() { const value = slideInput.val(); console.log(value); }); slideInput.on("scroll", function() { const value = slideInput.val(); console.log(value); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="number" id="slider-value" onmousewheel="" step=".1" min="2" max="10" placeholder="2.0" class="slider-value">

Answer 1

事件是wheel 。

 let slideInput = $("#slider-value"); $(document).ready(function() { slideInput.on("click", function() { const value = slideInput.val(); console.log(value); }); slideInput.on("wheel", function() { const value = slideInput.val(); console.log(value); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="number" id="slider-value" onmousewheel="" step=".1" min="2" max="10" placeholder="2.0" class="slider-value">