Невозможно создать новые типы входных данных HTML5 в IE7 с помощью селекторов атрибутов типов

Кажется, что даже при использовании shivs вы не можете сделать что-то вроде input[type="search"] для стилирования новых элементов ввода HTML5 в IE7. Вы можете увидеть пример в http://jsfiddle.net/2tmAp/ (конечно, просматривать его в режимах IE7).

Предположительно, IE7 устанавливает эти элементы в type="text", и даже если сам DOM остается таким же, он все равно каким-то образом предотвращает применение стилей.

Каким будет самый простой способ исправить это? Есть ли что-то, что мы можем сделать в Javascript, чтобы обмануть IE7 в применении стилей так же, как shivs работать над элементами?

1 ответ

Шив - это просто способ принудительного создания новых элементов независимо от того, поддерживается или нет. но обращаясь к типу и приписывая ему другую вещь, а также селекторы. резервные копии для новых "входов" - это тип "текст" . это касается поиска, datepicker и других (не может отслеживать новые).

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

  • Тип по умолчанию для входных элементов - это текст.
  • Все браузеры игнорируют неизвестные атрибуты.

Следствием этих двух моментов является то, что если вы скажете , , все браузеры будут относиться к этому идентично (, если только "foo" не является признанным вводом type или "bar" является признанным атрибутом входного элемента).

поскольку type="search" неизвестен IE7, он возвращается к type="text", и вы не можете выбрать его в CSS как type="search", так как теперь type="text"

чтобы решить проблему с селектором, вы можете попробовать использовать selectivizr, который использует возможности библиотек JS для выбора селектора, соответствующего кросс-браузеру (даже в неосновных браузерах с использованием некоторого псевдоселекторного соответствия script). Я не знаю, если они собирают элементы, созданные в shiv.

или лучше, используйте обычный способ создания поискового запроса в HTML/JS в качестве резервной копии,

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

input[type="search"],input.search{
 /*styles*/
}

licensed under cc by-sa 3.0 with attribution.