html - 将不可编辑的文本附加到输入末尾？

Question

HTML5 是否有任何属性可以将一些文本附加到输入值的末尾？例如，如果我有 <input type="text">有没有办法我可以附加类似 /hrs 的内容到输入值的末尾？

我可以很容易地用 JS 做到这一点，但它会包含在最终值中，并且管理起来很麻烦。

任何帮助或建议都会很棒，谢谢!

Answer 1

编辑了这个答案:https://stackoverflow.com/a/43964651/5674442

这是代码:

input {
  text-align: right;
  padding-right: 30px;
}

.placeholder {
    position: relative;
    display: inline-block;
}

.placeholder::after {
    position: absolute;
    right: 5px;
    top: 1px;
    content: attr(data-placeholder);
    pointer-events: none;
    opacity: 0.6;
}

<div class="placeholder" data-placeholder="/hrs">
    <input value="My text" />  
</div>