当前位置：网站首页>JS preventDefault() 键盘输入限制 onmousewheel stopPropagation停止事件传播

JS preventDefault() 键盘输入限制 onmousewheel stopPropagation停止事件传播

2022-07-28 17:28:00 【HandsomeDanielWu】

prevent阻止

输入限制onmousewheel

 <style>
        #box{
            width: 200px;
            height: 200px;
            background-color: #333;
            padding-bottom: 20px;
        }
        body{
            height: 2000px;
        }
    </style>
</head>
<body>
    <div id="box">
    </div>
    <div id="info"></div>
    <script>
        var oBox = document.getElementById('box');
        var oInfo = document.getElementById('info');
        var a = 0;
        // 给box盒子添加鼠标滚轮事件监听
        oBox.onmousewheel = function (e){
            // 阻止默认事件，就是说当用户在盒子里滚动鼠标滑轮的时候，不会触发页面的滚动条滚动
            e.preventDefault();
            if(e.deltaY > 0){
                a++;
            }else{
                a--;
            }
            oInfo.innerText = a;
        }
    </script>
</body>

stopPropagation 停止传播