Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.01.2013, 23:23
Аспирант
Отправить личное сообщение для Heidel Посмотреть профиль Найти все сообщения от Heidel
 
Регистрация: 11.06.2012
Сообщений: 71

Кроссбраузерный placeholder с использованием библиотеки Modernizr
Делаю кроссбраузерный placeholder с использованием библиотеки Modernizr по книге К.Шмитта "HTML5. Рецепты программирования"

подключаю библиотеку к странице

<script src="script/jquery-1.8.3.min.js"></script>
    <script src="script/modernizr-latest.js"></script>


пишу такой скрипт

<script>
		if (!Modernizr.input.placeholder) {
			  $(".search_form_field").focus(function() {
				if ($(".search_form_field").val() == $(".search_form_field").attr('placeholder')) {
				  $(".search_form_field").val("");
				}
			  });
			  $(".search_form_field").blur(function() {
				if ($(".search_form_field").val() == "") {
				  $(".search_form_field").val($(".search_form_field").attr('placeholder'));
				}
			  });
			$(".search_form_field").blur();
			$(".search").submit(function() {
			  if ($(".search_form_field").val() ==
			$(".search_form_field").attr('placeholder')) {
			  return false;
			  }
			});
		}
	</script>


но в ие он все равно не срабатывает.
В чем может быть проблема?
Делаю вот для такой верстки, для формы ввода логина и пароля.
Ответить с цитированием
  #2 (permalink)  
Старый 09.01.2013, 03:05
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

Старик давай для начала в более читабельный вид приведём код.

jQuery(function($){
    if (!Modernizr.input.placeholder) {

        var sField=$(".search_form_field");

        sField.focus(function() {
             var sf= $( this );
	         if ( sf.val() ==  sf.attr('placeholder') ) sf.val("");				
         });

        sField.blur(function() {
            var sf = $(this);
	        if ( sf.val() ==  "" )  sf.val( sf.attr('placeholder') );				
        });

        sField.blur();

        $(".search").submit(function() {
            var sf=$("#element"); 
  	        if (sf.val() ==sf.attr('placeholder')) return false;			  
        });
    }
})

вот теперь можно и IE заняться, хотя возможно он заработал уже

ЗЫ.
1)я заменил $(".search_form_field") на $("#element"); в submit,
так как использование класса подразумевает то что у тебя может быть несколько полей с классом .search_form_field
а это значит обращение к val() в этом случае приведёт к ошибке.

хотя совсем в идеале выборку для sField нужно делать не по классу .search_form_field а по наличию атрибута placeholder

2)теперь скрипт срабатывает только после готовности страницы.
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 09.01.2013 в 03:38.
Ответить с цитированием
Ответ



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

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