.maskable-true { border:solid 1px #ddd; width:300px; color:#aaa; } .maskable-false { border:solid 1px #ddd; width:300px; color:#222; }

<div style="padding: 10px;"> Маска текстового поля создаётся на обозначенных текстовых полях. <br /><br /> <form> <input class="maskable-true" type="text" id="LOGIN" />   <input class="maskable-true" type="text" id="PASSWORD" /> </form> </div>

function CreateTextMask(elementid, masktext) { var element = document.getElementById(elementid); element.value = masktext; element.onfocus = function() { if (element.value == masktext) { element.className = "maskable-false"; element.value = ""; } } element.onblur = function() { if (element.value.length == 0) { element.className = "maskable-true"; element.value = masktext; } } } //Пример использования CreateTextMask("LOGIN","Введите имя пользователя"); CreateTextMask("PASSWORD","Введите пароль");