时间戳

首页 > 解决方案 > 在 HTML 输入中增加数字但不增加字母

html - 在 HTML 输入中增加数字但不增加字母

问题描述

我有这个问题，我想有一个可以接受数字和字母的输入。我希望能够只增加和减少数字，但保持字母不变，并且用户不能删除字母。如下图：

仅输入数字和字母：
仅输入数字和过滤器

我有一个解决方法，通过在<span>mm</span>数字旁边使用position: absolute;.

有没有更好的方法呢？

标签： htmlcssinputletter

解决方案

在下面检查我的解决方案：

.input-num {position: relative;}
.input-num span { position: absolute; left: 18px;}
<div class="input-num">
  <input value="50" type="number" name="quantity" min="10" max="99">
  <span>mm</span>
</div>

推荐阅读