追加不可編輯的文字到輸入結束？

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' –

追加不可編輯的文字到輸入結束？

回答

相關問題