Что делать если placeholder не работает в Internet Explorer 9 (8, 7)

Заставляем работать PLACEHOLDER в Internet Explorer 9 и ниже.

Не люблю я верстать, но иногда приходится сделать, например, красивую форму обратной связи. А так как на дворе уже XXI век и дурацкие надписи над текстовыми полями делать уже стыдно, то нам на помощь приходит атрибут placeholder. Проблема в том, что не все используют современные браузеры, а многие из них и Internet Explorer 9 (и ниже). Вот эти старые браузеры в упор не хотят видеть данный атрибут.

В интернете есть множество решений этой проблемы, но самым элегантным и действительно простым я считаю нижеследующий.

1. Идем на http://jamesallardice.github.io/Placeholders.js/

2. Скачиваем Placeholders.js скрипт, а также jquery-1.10.2.min.js (я советую именно эту версию, т.к. 100% уверен в их совместимости) и закачиваем их себе на сервер.

3. Открываем редактором страницу, в которой будет находиться наша форма плейсхолдером.

4. В <head> страницы поместите следующий код:

<script src="js/placeholders.min.js"></script>
<script src="js/jquery-1.10.2.min.js"></script>

Это подразумевает, что вы поместили данные скрипты в подпапку сайта с названием «js».

5. В <body> страницы вставляем этот же самый, но теперь инициализирующий код:

<script src="js/placeholders.min.js"></script>
<script src="js/jquery-1.10.2.min.js"></script>

6. Готово. Больше ничего делать не надо, скрипт будет делать всё за нас.

Кроме абсолютной простоты и легковесности (4кб), мощным преимуществом этого скрипта является то, что он поддерживает огромное количество браузеров, в т.ч. Internet Explorer 6 :). Если вам нужна больше кастомизации — следуйте на сайт проекта.

Поделись/сохрани ссылку: