Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Подсказка в поле input (https://javascript.ru/forum/events/46934-podskazka-v-pole-input.html)

alex-boa 30.04.2014 10:47

Подсказка в поле input
 
Привет всем!
Есть всплывающая форма с подсказками в инпутах типа:

<input type='text' id='contact-name' class='contact-input' onclick='this.value=';' onfocus='this.select()' onblur='this.value=!this.value?'Имя':this.value ;' value='Имя' name='name' />

При клике по окну подсказка не пропадает, а выделяется. Заказчик по этому поводу парится - хочет, чтобы пропадала и появлялся мигающий курсор.
А я не могу никак…

рони 30.04.2014 10:59

alex-boa, может placeholder?
<input type='text' id='contact-name' class='contact-input' placeholder="Имя"  name='name' />

devote 30.04.2014 11:01

по новым технологиям есть атрибут placeholder
<input type="text" placeholder="Имя" />

но это не будет работать в старых браузерах, для них конечно:
<input type="text" id="contact-name" class="contact-input" onfocus="if(this.value=='Имя')this.value='';" onblur="if(this.value=='')this.value='Имя';" value="Имя" name="name" />

alex-boa 30.04.2014 12:49

пробовал и placeholder - таже фигня…

а с этим:

Цитата:

но это не будет работать в старых браузерах, для них конечно:
<input type="text" id="contact-name" class="contact-input" onfocus="if(this.value=='Имя')this.value='';" onblur="if(this.value=='')this.value='Имя';" value="Имя" name="name" />

даже текст не выделяется…(

Вот ведь фигня какая - в такой же статичной форме всё норм...

рони 30.04.2014 13:19

alex-boa,
может так ?
<input type="text" id="contact-name" class="contact-input" onclick='return false' onmouseup="return false" onfocus="if(this.value==this.defaultValue)this.value=''; else this.select();" onblur="if(this.value=='')this.value=this.defaultValue;" value="Имя" name="name" />

danik.js 30.04.2014 14:28

<style>
input:focus::-webkit-input-placeholder{
    visibility: hidden !important;
}
input:focus::-moz-placeholder{
    visibility: hidden !important;
}
</style>
<input type='text' id='contact-name' class='contact-input' placeholder="Имя"  name='name' />

Плюс префикс для IE, плюс placeholders.js или аналог и доп.стилем для него.

devote 30.04.2014 14:36

Цитата:

Сообщение от danik.js
Плюс префикс для IE, плюс placeholders.js или аналог и доп.стилем для него.

и плюс еще десяток костылей... :D

alex-boa 30.04.2014 15:09

Цитата:

Сообщение от рони (Сообщение 309888)
alex-boa,
может так ?
<input type="text" id="contact-name" class="contact-input" onclick='return false' onmouseup="return false" onfocus="if(this.value==this.defaultValue)this.value=''; else this.select();" onblur="if(this.value=='')this.value=this.defaultValue;" value="Имя" name="name" />

таже фигня - текст не выделяется и не исчезает...

alex-boa 30.04.2014 15:12

Цитата:

Сообщение от danik.js (Сообщение 309896)
<style>
input:focus::-webkit-input-placeholder{
    visibility: hidden !important;
}
input:focus::-moz-placeholder{
    visibility: hidden !important;
}
</style>
<input type='text' id='contact-name' class='contact-input' placeholder="Имя"  name='name' />

Плюс префикс для IE, плюс placeholders.js или аналог и доп.стилем для него.

…так поприкольней: курсор падает в начало строки, но текст не пропадает, а пропадает только когда начинаешь набирать свой…)

alex-boa 30.04.2014 15:15

Странный баг... У меня частный случай или ещё кто-то имеет такое?


Часовой пояс GMT +3, время: 16:12.