Modernizr.load не обеспечивает поддержку ввода и текстового поля в IE7 / IE8

Я использую довольно хороший плагин-заполнитель jQuery Матиаса Биненса для отображения заполнителей в мой сайт в браузерах, которые не поддерживают его изначально. Я вызываю плагин с помощью специальной версии Modernizr в нижнем колонтитуле страницы сразу после кода Google Analytics. Я комбинирую его со сценарием (описанным в этом ответе на переполнение стека) для отображения PNG в IE6.

Modernizr вызывается в шапке, и на сайте тоже используется Typekit. jQuery вызывается только тогда, когда функциональность заполнителя отсутствует, поскольку в противном случае она фактически не нужна.

Соответствующий код, который я называю в нижнем колонтитуле блога WordPress, выглядит так:

1. Исправьте PNG:



    s.parentNode.insertBefore(g, s)
    }(document, 'script'));
    function fixPngs() {
        for (i = 0; i  0) {
                fixPng(a, document.images[i])
            }
        }
    }
    function fixPng(a, b) {
        b.src = "http://cdn.donaldjenkins.com/media/themes/belgravia/2/spacer.gif";
        b.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"
        a "', sizingMethod='scale')"
    };

2. Добавьте заполнители:


    Modernizr.load({
        test: Modernizr.input.placeholder,
        nope: ["http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js", "http://cdn.donaldjenkins.com/wp-content/themes/belgravia/js/placeholder.js"],
        complete: function () {
            $('input, textarea').placeholder();
        }
    });

3. Вызов скрипта PNG.


fixPngs();

К сожалению, заполнитель отображается в IE6 и IE9, но нет в IE7 или IE8. Я попытался создать html сайт-песочницу, который воспроизводит ресурсы, описанные выше, чтобы попытаться определить причину проблемы. … Но у меня та же проблема. Я пробовал другие плагины-заполнители с тем же результатом.

РЕДАКТИРОВАТЬ: после полезного ответа Матиаса Биненса и проверки того, работают ли плагины jQuery-заполнителя без Modernizr, я пришел к выводу, что это проблема Modernizr: если плагин-заполнитель и jQuery загружены систематически, без использования Modernizr, заполнители отображаются во всех браузерах - при загрузке через Modernizr они отображаются в IE6 и 9, но не в IE 7 и 8.

Я пробовал переключиться с пользовательской версии Modernizr на версию для разработки, но результат остался прежним.


jquery internet-explorer placeholder modernizr
person Donald Jenkins    schedule 20.02.2012    source источник

Ответы (1)


arrow_upward
1
arrow_downward

http://cdn.donaldjenkins.com/wp-content/themes/belgravia/js/jquery.placeholder.min.js - ошибка 404 для меня. Полагаю, в этом проблема? :)

$ curl -sI http://cdn.donaldjenkins.com/wp-content/themes/belgravia/js/jquery.placeholder.min.js | head -n 1
HTTP/1.1 404 Not Found

Возможно, это не связано с вашей проблемой, но вам не следует просто использовать Modernizr.input.placeholder проверку, если вам нужна textarea@placeholder поддержка. Причина в том, что некоторые браузеры поддерживают input@placeholder, но не textarea@placeholder. Modernizr.input.placeholder означает только input поддержку.

Плагин в любом случае выполняет эту внутреннюю проверку, но если вы хотите использовать Modernizr, сделайте это следующим образом:

Modernizr.load({
  'test': Modernizr.input.placeholder && Modernizr.textarea.placeholder,
  'nope': ["http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js", "http://cdn.donaldjenkins.com/wp-content/themes/belgravia/js/jquery.placeholder.min.js"],
  'complete': function() {
    $('input, textarea').placeholder();
  }
});

Тем не менее, если вам не нужна textarea@placeholder поддержка, вы можете снять флажок и удалить textarea из селектора.

person Mathias Bynens    schedule 20.02.2012
comment
Вау, это было быстро - спасибо. Не уверен, почему вы получаете 404 в скрипте - для меня загрузка выполняется нормально ... Мне действительно нужна input поддержка на большинстве страниц и textarea поддержка на странице контактов (которая находится за пределами WordPress и фактически отображает заполнители в textarea полях в IE 6 и IE9…) - person Donald Jenkins; 20.02.2012
comment
Не могу понять, почему вы оба получаете 404 по сценарию. Странный. В любом случае, причина, по которой я использую Modernizr, заключается в том, чтобы не загружать плагин jQuery + Mathias, если он не нужен - а они есть, только если функциональность отсутствует. Я исправил код, чтобы включить предложение Матиаса, но мне все еще не повезло в IE7 и 8. - person Donald Jenkins; 20.02.2012
comment
После проверки моего CDN выяснилось, что у них _до_ есть проблема с jsfiles с точками в них ... Я переименовал файл в cdn.donaldjenkins.com/wp-content/themes/belgravia/js/ - но все равно получаю тот же результат: заполнители в IE6 и 9, но не в IE7 и 8… Не знаю, где искать дальше. - person Donald Jenkins; 20.02.2012
comment
@DonaldJenkins. Я вижу заполнители в IE7 на dbdj.org. Здесь вроде все нормально работает. - person Mathias Bynens; 20.02.2012
comment
Я фактически сузил круг вопросов до Modernizr. Если вы загружаете jQuery и плагин систематически, не выполняя тест Modernizr, заполнители отображаются во всех версиях IE. Если вы используете Modernizr.load, они отображаются только в IE6 и IE9. То же самое происходит с другими плагинами-заполнителями, вероятно, это что-то с Modernizr. - person Donald Jenkins; 20.02.2012
comment
В основном пришел к выводу, что это проблема Modernizr: если плагин-заполнитель и jQuery загружаются систематически, без использования Modernizr, заполнители отображаются во всех браузерах - при загрузке через Modernizr они отображаются в IE6 и 9, но не в IE 7 и 8. - person Donald Jenkins; 21.02.2012
comment
Кажется, что «полная» функция выполняется независимо от результата теста. Так что в случае отрицательного результата $('input, textarea').placeholder(); вызовет неопределенную функцию - или я что-то упустил? - person johjoh; 31.10.2012