2015-02-27 6 views
0

Новые типы и атрибуты HTML5, то есть tel, email, pattern и т. Д. Полезны для указания ненавязчивому валидатору javascript, какие правила должны применяться к данному полю.Могу ли я создать свои собственные типы ввода html5?

В некоторых случаях конкретный тип поля, который не находится в спецификации, нуждается в специальном алгоритме. Например, input type="credit-card" заставит валидатор использовать алгоритм modulo10, соответствие шаблону не может быть проверено.

Новые типы ввода работают, потому что старые браузеры возвращаются к type="text", когда он не понимает указанный тип. Из того, что я могу сказать, новые браузеры, похоже, следуют этому соглашению.

Поскольку уже type атрибут, который семантический правильно, это кажется беспорядочным и непоследовательным использовать отдельный data-type="" атрибут часть времени и официальный type атрибут, когда требуется тип уже существует.

Я понимаю, что в какой-то день может быть тип с тем же именем, но если W3C добавит input type="credit-card" в какой-то момент в будущем, каковы же шансы сделать что-то другое, кроме проверки кредитной карты? (Или, другими словами, до тех пор, пока типы называются хорошо, единственным конфликтом будет то, что было предусмотрено в любом случае).

Есть ли подводные камни, чтобы просто создавать новые типы ввода, поскольку они мне нужны?

+2

Так же, как вы правильно заметили, эти типы могут быть заселены в будущем. Кроме того, каждый, кто забирает код после вас, будет очень путаным, читая несуществующие типы полей. Просто придерживайтесь атрибутов данных или имен классов. – goodpixels

+0

Я не думаю, что разработчик, «супер-запутанный» от '', - это тот, кому я хотел бы работать над одним из моих проектов! Чтобы уточнить, я не ищу философский ответ, если это нужно сделать, а скорее технический ответ на вопрос «будет ли он работать по назначению во всех основных браузерах сегодня». – Nick

ответ

0

Я бы рекомендовал использовать javascript framework, особенно если вы начинаете новый проект. В этих рамках вы можете создавать повторно используемые компоненты. Например, вы можете определить компонент кредитной карты, реализовать свою конкретную проверку, стили и логику, а затем повторно использовать свой новый компонент во всем приложении.

В angular.js, самый популярный Javascript каркас, который поддерживается Google, это называется директивой: https://docs.angularjs.org/guide/directive

В ember.js, это называется компонентом.

Ловушки для примера кредитной карты будут пытаться изобрести собственные регулярные выражения для проверки или найти плохое регулярное выражение в Интернете, которое на самом деле не работает. Но использование пользовательских веб-компонентов в фреймворках javascript довольно стандартно. Вы также должны удостовериться, что любые используемые библиотеки javascript, которые вы используете, совместимы с любыми браузерами и конфигурациями браузера, которые вы хотите поддерживать.

Смежные вопросы