input类型为number时鼠标滚动出现箭头

在移动端开发中，通常需要输入法自动出现数字键盘，我们可以设置type类型为number或者tel

为number时maxlength失效

为tel时，

如果type='text' type='tel'这样顺序，苹果手机数字键盘为九宫格，但安卓不是数字键盘

如果type='tel' type='tex'这样顺序，苹果手机数字键盘包含符号，安卓是数字键盘

但input类型为number时鼠标滚动出现箭头

解决方案1：

<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>

更好的解决方案2：

<input id="txtPhone" pattern="[0-9]*" type='tel' placeholder="请输入数字">

参考：

https://www.cnblogs.com/lhl66/p/9164000.html

input类型为number时鼠标滚动出现箭头相关推荐

input类型为number时，去掉上下箭头
<input type="number"><style>input::-webkit-outer-spin-button,input::-webkit-in ...
input 类型为 number 时如何去掉数字加减上下箭头
input 类型为 number 时,输入框右侧有数字加减按钮,想将该按钮去掉添加以下 css 代码 /* input 类型为 number 时去掉数字加减上下箭头 */ input::-webki ...
input在type=number时去右边上下箭头
html: <input type="number"> css: <style>input::-webkit-outer-spin-button,input ...
移除HTML5 input在type=number时的上下小箭头
在chrome下: input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{ -webkit-appearance ...
html加减中间的值不能修改,在移动HTML5页面input类型采用number无法控制长度，以及右边显示难看的加减按钮...
场景: 这是之前做的移动web控件时遇到的问题.当时在我们控件的HTML5页面需要输入卡号.CV2.手机号.验证码等信息.大家都知道这些值都是数字.普通类型的输入框,当我们点击时,手机默认掉起的键盘 ...
input的type=number时可以输入字母e的解决方式
在开发中遇到的问题,当输入框input的type=number时,仍然可以输入字母e或E,查了资料后才知道,原来当type=number时,计算机是这么处理的:主要原因是e在数学上代表的是⽆理数,是⼀ ...
【elementUI样式优化】之el-input输入数字类型 type=‘number‘ 不显示右侧上下箭头 == 修改箭头右边距
先完成再完美,完成永远比完美重要. 使用element UI的el-input设置属性为type="number"时,样式很不好看如果接受有上下箭头==>需要修改el-in ...
删除input框type=number时，默认的上下小箭头
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
ElementUI el-input 设置 type 类型为 number 时，如何去掉上下指示箭头
主要是设置 css 样式 input[type=number] { -moz-appearance:textfield; } input[type=number]::-webkit-inner-spi ...
antd Input输入框type=number时如何去掉内部上下箭头
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none; } inpu ...

input类型为number时鼠标滚动出现箭头

input类型为number时鼠标滚动出现箭头相关推荐

最新文章

热门文章