是否可以始终显示输入“数字”的上/下箭头？

我想始终显示输入“数字”字段的上/下箭头。这可能吗？到目前为止，我还没有任何运气...

http://jsfiddle.net/oneeezy/qunbnL6u/

HTML：

<input type="number" />

CSS：

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {  

   -webkit-appearance: "Always Show Up/Down Arrows";

}

您可以使用Opacity属性（至少在Chrome中）实现此目的：

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {  

   opacity: 1;

}

如上所述，这可能仅在Chrome中有效。因此，请谨慎使用此代码，不要对其他浏览器进行回退。

我尝试了这个并且有效

input[type=number]::-webkit-inner-spin-button {
    opacity: 1
}

</style>
<input type="number" value="1" min="1" max="999">

在这里找到

如果您试图在不同的浏览器上获得相同的外观，则可能会被迫使用插件/小部件或自己构建一个插件/插件，所有主要的浏览器似乎都在实现数字微调器。

尝试使用jQuery UI的Spinner小部件，它在样式方面提供了更多的通用性。

工作实例

<p>
    <label for="spinner">Select a value:</label>
    <input id="spinner" name="value" />
</p>

$("#spinner").spinner();

如果您不介意专注于输入，请执行

   document.getElementById(<id>).focus();