zoukankan      html  css  js  c++  java
  • input type = number 去除上下箭头,禁用滚轮事件(默认的自带滚轮加减数字)

    <style type="text/css">
        /*盒子大小从边框开始计算*/
        html * {
            box-sizing: border-box;
        }
        /*解决模态框抖动*/
        html {
            overflow-y: scroll;
            -ms-overflow-style: none;
        }
        /* 隐藏滚动条 */
        html::-webkit-scrollbar {
            display: none;
        }
        body {
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-size: 14px;
        }
        /* 去除webkit中input的type="number"时出现的上下图标 */
        input::-webkit-outer-spin-button,
        input::-webkit-inner-spin-button {
            -webkit-appearance: none;
        }
        input[type="number"] {
            -moz-appearance: textfield;
        }
    </style>
    <!DOCTYPE html>
    <html lang="en">
    
        <head>
            <meta charset="UTF-8">
            <title>禁止input输入框的鼠标滚轮事件</title>
            <script src="jquery.js"></script>
        </head>
        <body>
            <!-- 禁止谷歌浏览器、Opera浏览器以及360浏览器等采用谷歌内核的浏览器 -->
            <input type="number" id="inp1" onmousewheel="return false;">
            <!-- 禁止Firefox浏览器 -->
            <input type="number" id="inp2">
            <script>
                $("#inp2")[0].addEventListener('DOMMouseScroll', MouseWheel, false);
                function MouseWheel(event) {
                    event = event || window.event;
                    event.preventDefault();
                }
            </script>
        </body>
    
    </html>

     

  • 相关阅读:
    21 情态动词
    20 动词的用法
    19 完成时/现在完成时和过去完成时的区别
    18 将来时
    17 一般过去时和过去进行时
    16 一般现在时和现在进行时
    15 There / Here be句型
    14 不定量表达法
    13 副词
    12 形容词
  • 原文地址:https://www.cnblogs.com/lhl66/p/9164000.html
Copyright © 2011-2022 走看看