0

Использую у input-а такой способ валидации данных (смотреть код ниже). Например, оставляю пустую строку и нажимаю на кнопку "Тест". Получаю сообщение о неверных данных и всё вроде прекрасно. Но, если тут же (без промедления) продолжать вводить данные в input, то ошибка продолжает висеть, хотя ожидается её исчезновение.

Если подождать пару секунд без каких-либо нажатий или сбросить фокус с input, то конечно же ошибка исчезает. Вешать какое-то рядом сообщение "Подожди-ка, браток, чутка!" не очень хочется. Может кто-то знает, как эту проблемку решить?

<form>
    <input oninput="this.setCustomValidity('')" oninvalid="this.setCustomValidity('Неверные данные')" type="text" placeholder="Введите данные" required pattern="[0-9]{10}" />
    <input type="submit" value="Тест" />
</form>

1 ответ 1

2

Так как сообщение пропадает при анфокусе, то видимо лечится это как-то так (хотя думаю есть что-то более нативное):

<form>
    <input oninvalid="this.setCustomValidity('Неверные данные')" oninput="this.setCustomValidity('');this.blur();this.focus();" type="text" placeholder="Введите данные" required pattern="[0-9]{10}" id="number" />
    <input type="submit" value="Тест" />
</form>

1
  • Благодарю! Я focus и blur вставлял в событие oninvalid. Наугад палил. Ещё раз спасибо! 1 окт 2017 в 10:52

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.