想要禁止鼠标滚动导致数字增加的问题

Question

input[type="number"] 我可以做到说没有右侧的上下箭头 但是没有办法做到 因为滚动而导致数字改变的问题

Answer 1

可以把number换成tel
同样是数字，而且默认就没有上下箭头

或者写成这样

<input type="number" onmousewheel="return false;">

Answer 2

if(el.addEventListener){  
    el.addEventListener('DOMMouseScroll',fn,false);  
}//火狐  
el.onmousewheel=fn;
function fn(){
    return false;
    }

Answer 3

<script>
    //给页面绑定滑轮滚动事件
    document.addEventListener('DOMMouseScroll', scrollFunc, false);

    function scrollFunc(event){
        event = event || window.event;
        if (event.wheelDelta) {  //判断浏览器IE，谷歌滑轮事件             
            if (event.wheelDelta > 0) { //当滑轮向上滚动时
                alert("滑轮向上滚动");
            }
            if (event.wheelDelta < 0) { //当滑轮向下滚动时
                alert("滑轮向下滚动");
            }
        } else if (event.detail) {  //Firefox滑轮事件
            if (event.detail> 0) { //当滑轮向上滚动时
                alert("滑轮向上滚动");
            }
            if (event.detail< 0) { //当滑轮向下滚动时
                alert("滑轮向下滚动");
            }
        }
    }

    //滚动滑轮触发scrollFunc方法
    window.onmousewheel = document.onmousewheel = scrollFunc;  
</script>