input号码隐藏微调 – Firefox 29

在Firefox 28上，我使用的是<input type="number">因为它在input字段中只显示数字键盘。

在Firefox 29中，使用数字input在字段的右侧显示旋转button，这在我的devise中看起来像垃圾。 我真的不需要button，因为无论如何，当你需要写一个6〜10位数字的东西时，它们是无用的。

是否有可能禁用CSS或jQuery的这个？

Answer 1

根据这篇博文 ，你需要设置-moz-appearance:textfield; 在input 。

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

 <input type="number"/> 

Answer 2

值得指出的是这些元素的-moz-appearance默认值是Firefox中的number-input 。

如果你想默认隐藏微调器，你可以先设置-moz-appearance: textfield ，如果你想让微调器出现在:hover / :focus ，你可以用-moz-appearance: number-input 。

 input[type="number"] { -moz-appearance: textfield; } input[type="number"]:hover, input[type="number"]:focus { -moz-appearance: number-input; } 

 <input type="number"/> 

Answer 3

面对同样的问题，火狐更新到29.0.1后，这里也列出了https://bugzilla.mozilla.org/show_bug.cgi?id=947728

解决scheme：他们（Mozilla家伙）通过引入对<input type="number"> “-moz-appearance”的支持来解决这个问题。 你只需要用“ -moz-appearance:textfield; ”将input字段与样式关联起来。

我更喜欢CSS方式，例如： –

 .input-mini{ -moz-appearance:textfield;} 

要么

你也可以这样做：

 <input type="number" style="-moz-appearance: textfield"> 

Answer 4

 /* for chrome */ input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0;} /* for mozilla */ input[type=number] {-moz-appearance: textfield;}