Вот что задумывалось сделать. Нужно было при нажатии на форму «Логин» слово исчезало и можно было вписывать все что хочешь. А потом, если поле осталось пустым, при нажатии курсора в другом месте страницы, опять появлялось слова.
Вообщем я не могу похвастаться тем, что хорошо объясняю. Поэтому приведу пример:
Чтобы понять как сделать это, не нужно лезть в исходный код и смотреть. Потому что я сейчас напишу вам об этом.
Для начала создадим саму форму ввода. Это не составит труда:
<input type="text">
type — это обязательный параметр, который показывает на тип содержания и визуализация кнопок.
- тип кнопки=SUBMIT — рисует кнопку с надписью «надпись» — обработчик checkbox
- тип кнопки=RADIO — рисует круглую кнопку — обработчик onclick
- параметр CHECKED — обозначает, что кнопка помечена
- параметр VALUE — определяет имя, присвоенное переменной
- тип кнопки=CHECKBOX — рисует квадрат, в котором можно сделать пометку — обработчик onclick
- параметр CHECKED — обозначает, что кнопка помечена
- параметр VALUE — определяет имя, присвоенное переменной
- тип кнопки=BUTTON — рисует кнопку с надписью надпись — обработчик onclick
- тип=HIDDEN — определяет скрытый элемент данных
- параметр NAME — определяет переменную
- параметр VALUE — определяет имя, присвоенное переменной
- тип кнопки=TEXT — ввод текста в окно
- параметр VALUE — текст по умолчанию
- параметр SIZE — ширина окна в символах
- тип кнопки=PASSWORD — окно для ввода пароля
- параметр VALUE — пароль по умолчанию
- параметр SIZE — ширина окна в символах
- параметр MAXLENGTH — допустимая длина пароля
- тип кнопки NUM — ввод числа в окно
- параметр VALUE — число по умолчанию
- тип кнопки RESET — сброс данных формы
Сейчас мы имеем только тип нашей кнопки «text». Как видим выше к этому типу есть два параметра «value» и «size». Мы введем только валуе, например «Логин».
<input type="text" value="Логин">
В принципе, большинство новичков оставляют и так. Но это вовсе не удобно. Нужно вручную убирать символы.. Я же предлагаю воспользоваться функцией «onFocus«.
Событие onFocus возникает при получении объектом фокуса при переходе по клику мыши или с помощью клавиатуры.
Теперь выведем пустое поле в форме с помощью этой функции:
<input type="text" value="Логин" onFocus='this.value="";'>
Хм.. Уже что-то. Но здесь значение будет онуляться всегда, что бы не вводили. Я предлагаю онулять значение только тогда, когда введено стандартное. В нашем случае это «Логин», поэтому прописываем функцию:
<input type="text" value="Логин" onFocus='if(this.value=="Логин")this.value="";'>
Если у вас стандартное значение (value) другое, то в onFocus введите свое.
Ну вот в принципе большая часть работы сделана. Осталось сделать так, чтобы при нулевом значении выводилось стандартное. Здесь нам поможет функция «onBlur«.
Событие onBlur возникает при потере объектом фокуса при переходе по клику мыши или с помощью клавиатуры.
И аналогично как с onFocus, так и с onBlur, выводим стандартное значение:
<amp;lt;input type=&quot;text&quot; value=&quot;Логин&quot; onFocus='if(this.value==&quot;Логин&quot;)this.value=&quot;&quot;;' onBlur='if(this.value==&quot;&quot;)this.value=&quot;Логин&quot;;'&amp;amp;>
Ну вот и все. Если возникнут вопросы, спрашивайте.
Эксклюзивная аренда элитной недвижимости в Москве — только пристижные районы.
Ответить | Цитировать
Ответить | Цитировать
Плюс добавлю — чтобы HTML проходил валидацию, надо писать onfocus и onblur — без прописных, в общем. Хотя работать и так будет.
Ответить | Цитировать
Ответить | Цитировать
Ответить | Цитировать
Ответить | Цитировать