Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.04.2014, 10:47
Интересующийся
Отправить личное сообщение для alex-boa Посмотреть профиль Найти все сообщения от alex-boa
 
Регистрация: 17.02.2014
Сообщений: 14

Подсказка в поле 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' />

При клике по окну подсказка не пропадает, а выделяется. Заказчик по этому поводу парится - хочет, чтобы пропадала и появлялся мигающий курсор.
А я не могу никак…
Ответить с цитированием
  #2 (permalink)  
Старый 30.04.2014, 10:59
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

alex-boa, может placeholder?
<input type='text' id='contact-name' class='contact-input' placeholder="Имя"  name='name' />
Ответить с цитированием
  #3 (permalink)  
Старый 30.04.2014, 11:01
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

по новым технологиям есть атрибут 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" />
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #4 (permalink)  
Старый 30.04.2014, 12:49
Интересующийся
Отправить личное сообщение для alex-boa Посмотреть профиль Найти все сообщения от alex-boa
 
Регистрация: 17.02.2014
Сообщений: 14

пробовал и 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 в 13:07.
Ответить с цитированием
  #5 (permalink)  
Старый 30.04.2014, 13:19
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

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" />
Ответить с цитированием
  #6 (permalink)  
Старый 30.04.2014, 14:28
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

<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 или аналог и доп.стилем для него.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #7 (permalink)  
Старый 30.04.2014, 14:36
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от danik.js
Плюс префикс для IE, плюс placeholders.js или аналог и доп.стилем для него.
и плюс еще десяток костылей...
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #8 (permalink)  
Старый 30.04.2014, 15:09
Интересующийся
Отправить личное сообщение для alex-boa Посмотреть профиль Найти все сообщения от alex-boa
 
Регистрация: 17.02.2014
Сообщений: 14

Сообщение от рони Посмотреть сообщение
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" />
таже фигня - текст не выделяется и не исчезает...
Ответить с цитированием
  #9 (permalink)  
Старый 30.04.2014, 15:12
Интересующийся
Отправить личное сообщение для alex-boa Посмотреть профиль Найти все сообщения от alex-boa
 
Регистрация: 17.02.2014
Сообщений: 14

Сообщение от danik.js Посмотреть сообщение
<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 или аналог и доп.стилем для него.
…так поприкольней: курсор падает в начало строки, но текст не пропадает, а пропадает только когда начинаешь набирать свой…)
Ответить с цитированием
  #10 (permalink)  
Старый 30.04.2014, 15:15
Интересующийся
Отправить личное сообщение для alex-boa Посмотреть профиль Найти все сообщения от alex-boa
 
Регистрация: 17.02.2014
Сообщений: 14

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Получить координаты курсора в текстовом поле в пикселях prike Events/DOM/Window 4 23.05.2013 04:35
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27
IE 8: курсор, установленный в поле INPUT, пробивает стены насквозь! Маэстро Internet Explorer 4 21.06.2011 01:38
Opera не выполняет style.fontSize=... в поле input Маэстро Opera, Safari и др. 6 20.06.2011 12:03
Перенос id чекбокса в поле input azarubin Общие вопросы Javascript 7 14.01.2011 22:30