minor fixes

This commit is contained in:
Ilya Kantor 2015-05-22 21:07:46 +03:00
parent 6bf5977407
commit a592e89fdb
20 changed files with 184 additions and 96 deletions

View file

@ -77,6 +77,7 @@
// показать ошибку
this.classList.add("error");
*!*
//... и вернуть фокус обратно
age.focus();
*/!*
} else {
@ -86,10 +87,14 @@
</script>
```
Если в примере выше ввести что-то нецифровое в поле "возраст", и потом попытаться табом или мышкой перейти на другой `<input>`, то обработчик `onblur` вернёт фокус обратно.
Этот пример работает во всех браузерах, кроме Firefox ([ошибка](https://bugzilla.mozilla.org/show_bug.cgi?id=53579)).
Если ввести что-то нецифровое в поле "возраст", и потом попытаться табом или мышкой перейти на другой `<input>`, то обработчик `onblur` вернёт фокус обратно.
Обратим внимание -- если из `onblur` сделать `event.preventDefault()`, то такого же эффекта не будет, потому что `onblur` срабатывает уже *после* того, как элемент потерял фокус.
## HTML5 и CSS3 вместо focus/blur
Прежде чем переходить к более сложным примерам, использующим JavaScript, мы рассмотрим три примера, когда его использовать не надо, а достаточно современного HTML/CSS.
@ -157,10 +162,14 @@
color: red;
font-style: italic;
}
.my*!*::-ms-input-placeholder*/!* {
color: red;
font-style: italic;
}
</style>
<input class="my" type="text" placeholder="E-mail">
Стилизуется везде, кроме IE
Стилизованный плейсхолдер
```
## Разрешаем фокус на любом элементе: tabindex

View file

@ -1 +0,0 @@
[edit src="solution"]Открыть решение в песочнице[/edit]

View file

@ -23,8 +23,6 @@
Первый: Enter в текстовом поле <input type="text" value="Текст"><br>
Второй: Нажать на "Отправить": <input type="submit" value="Отправить">
</form>
</button>
```
Ожидаемое поведение: