Question

我试图禁用输入微调器，但我在这里所能做的就是隐藏它，就像这样：

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

但怎么可以完全禁用？

Answer 1

使用此Jquery可以禁用它，因此鼠标滚轮不会更改数字

$(':input[type=number]').on('mousewheel', function(e){
    $(this).blur(); 
});

来源：https://css-tricks.com/snippets/css/turn-off-number-input-spinners/

Answer 2

试试这个：

/* For Firefox */
input[type='number'] {
    -moz-appearance:textfield;
}

/* Webkit browsers like Safari and Chrome */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

来源：https://blog.rudolphk.co.za/css-tip-remove-spinner-on-input-of-number-9fc4d9cac121

关闭HTML5号码输入旋转器

2 个答案: