Question

我想总是显示/向下箭头输入＆＃34;数字＆＃34;领域。这可能吗？到目前为止，我还没有运气......

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

}

Answer 1

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

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

   opacity: 1;

}

如上所述，这可能仅适用于Chrome。因此，请谨慎使用此代码，而不要回退其他浏览器。

Answer 2

我尝试了这个，它奏效了

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

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

Found Here

Answer 3

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

尝试jQuery UI's spinner widget它在样式方面提供了更多功能。

<强> Working Example

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

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

Answer 4

如果您不介意输入，请

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

是否可以始终显示上/下箭头输入＆＃34;数字＆＃34;？

4 个答案: