Пользовательская проверка формы с новыми элементами HTML 5 - PullRequest
Новая
       5

Пользовательская проверка формы с новыми элементами HTML 5

0 голосов
/ 05 февраля 2019

Я бы использовал новые теги и атрибуты HTML 5 в форме.Но у меня есть некоторые сомнения:

1. Поддержка старого браузера Если браузер не поддерживает тег или атрибут, я мог бы проверить это с помощью Modernizr, например какthis: 

    if(Modernizr.canvas)
    {
       //code if the canvas is supported
    }
    else
    {
       //code if the canvas isn't supported
    }

Но мне не нравятся ни эстетика, ни функциональность некоторых тегов и атрибутов HTML 5. Например, если я полагаюсь на атрибут pattern для проверки входных полей (типа = "текст") формы, которую я не могу или я не могу сделать красной границей поля ввода, пока ввод не будет действительным, не прибегая к javascript и пользовательской проверке (событие onkeypress, таким образом, проверка для каждого вставленного символа и т. д.).
Интересно, хорошо ли перебирать функциональность HTML 5 и использовать старую проверку с использованием Javascript (таким образом, нет типа email, tel и т. Д., Нет шаблона HTML 5).

2.Кросс-браузерная проблема Я мог убедиться, что текущий браузер поддерживает определенный тег или атрибут с Modernizr, но есть ли у меня гарантия, что определенный тег
или атрибут имеют одинаковое поведение в каждом браузере?Тривиально шаблон атрибута на FIrefox делает красный цвет границ поля ввода текста
с недопустимым текстом (я полагаю, на событии onChange), другие браузеры (как Chrome) нет.

Таким образом, для пользовательских эффектов и обратной совместимости при проверке формы я должен использовать старый <input type="text" /> и javascript (без типа email, номер, поиск, тел. И т. Д., Без шаблона и т. Д.) Или нет?

Есть ли хороший способ обойти эти проблемы?

...