追加不可编辑的文字到输入结束？

HTML5是否有任何属性可将一些文本附加到输入值的末尾？例如，如果我有一个<input type="text">是否有一种方法可以追加类似/hrs的东西，然后结束输入值？追加不可编辑的文字到输入结束？

我可以很容易地做到这一点与JS，但它将被包括在最终的价值，并将是繁琐的管理。

任何帮助或建议将是伟大的，谢谢！

来源

2017-05-14 Joe Scotto

告诉我们如何与JS做到这一点，我们会尽量让它为你那么繁琐。 – mehulmpt

为什么你不想要一个恒定的后缀在编辑框之外？ –

@AndreySScherbakov我想尝试一下，它的所有内容都包含在输入中，我可以很容易地添加一个引导程序插件，但我不想那样做。此外，与我的错误验证它并没有真正的工作有一个插件。 –

编辑这样的回答：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>

来源

2017-05-14 13:49:09 Rishi

接近我想要的，但我不想让它在打字时消失。 –

我将编辑帖子 – Rishi

好。这个给你。

.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>

来源

2017-05-14 13:50:13 mehulmpt

这是更接近，但我希望它与文本例如'33/hrs' –

追加不可编辑的文字到输入结束？

回答

相关问题