javascript - 强制 % 进入文本框，右对齐

Question

我有一个显示百分比的文本框。我怎么能以某种方式将 % 符号隐藏(如果这是正确的词)到文本框中，以便它始终存在并且始终位于文本框的最右侧？

Answer 1

我的首选策略是将 input 和您想要的任何标签包装在样式看起来像 input 的 div 中，然后删除输入来自 input 的样式。我不会在生产页面上以这种方式设置宽度，但希望它能插入正确的方向。

.wrapper {border: 1px solid gray; width:110px;}
input {border:none; width:90px;}
.label {width:10px;}

<div class="wrapper">
  <input type="text" name="percent"/>
  <span class="label">%</span>
</div>