是否有可能擁有「永久」佔位符？

我正在研究一個包含一些文本框的系統，這些文本框可以測量諸如溫度，心率每分鐘跳動等等。現在，我只是使用一個文本框並將該單元添加到同一行上的文本框之後。是否有可能擁有「永久」佔位符？

我的問題是空間相當有限，所以如果可能的話，我想在文本框中包含單元信息，如右對齊。我知道HTML5佔位符屬性，但這只是爲了適用於空字段並在輸入數據後消失。我想要的是該單位信息始終可見。

像永久版本的佔位符存在嗎？或者有沒有辦法實現這樣的功能？我已經搜索了這個問題，並發現this link幾乎解決了這個問題，但所有這些佔位符在輸入文本時消失了 - 我想要一個佔位符的等效物，但它始終可見，而不會顯示在POST數據中提交。

來源

2013-06-19 Roy

這很有趣...爲什麼不減少的文本框的大小呢？ – AlvinArulselvan

這是可能的，如果我找不到我正在尋找的解決方案，我可能會這樣做，但我認爲讓文本框中的單元灰顯並右對齊看起來有點整齊。 – Roy

這是你在找什麼：http://twitter.github.io/bootstrap/base-css.html#forms預先和附加的輸入 – Turcia

這種可能的解決方案無關與HTML5佔位符，但如果你相應地調整它的代碼應該工作，你怎麼想：

http://attardi.org/labels2/#demo

看第四輸入領域，「佔位符'一旦你鍵入內容就會被隱藏，但是你可以很容易地在javascript代碼中改變它。

然而，如果這是你想要的，你需要編寫一些能夠在輸入內容時移動'佔位符'的內容。

來源

2013-06-19 11:38:12 BOb

通過將輸入封裝在特殊div中，您可以在輸入字段上添加一段文本和絕對位置。

<div class="input-container"> 
    <input type="text" value="102.95" name="" /> 
    <span class="unit">Volts</span> 
</div> 
<div class="input-container"> 
    <input type="text" value="30" name="" /> 
    <span class="unit">Kilos</span> 
</div> 
<div class="input-container"> 
    <input type="text" value="64" name="" /> 
    <span class="unit">km/h</span> 
</div> 

.input-container { 
    position: relative; 
    width: 150px; 
} 
.input-container input { 
    width: 100%; 
}

CSS：

.input-container { 
    position: relative; 
    width: 150px; 
} 
.input-container input { 
    width: 100%; 
} 

.input-container .unit { 
    position: absolute; 
    display: block; 
    top: 3px; 
    right: -3px; 
    background-color: grey; 
    color: #ffffff; 
    padding-left: 5px; 
    width: 45px; 
}

演示：http://jsfiddle.net/mgmBE/3/

來源

2013-06-19 12:00:14

是否有可能擁有「永久」佔位符？

回答

相關問題