Как показать предупреждающий знак при построении формы в html5?

Question

У меня есть форма, показанная ниже, в которой я размещаю alt text, который будет отображаться на веб-странице.

<form action="/action_page.php">
  Alt <input type="text" name="e1_alt" required>
  <input type="submit">
</form>

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

Постановка проблемы: Мне интересно, какие изменения я должен внести в приведенный выше HTML-код или Код JavaScript Мне нужно добавить, чтобы при появлении предупреждающего знакаон пуст, но не должен мешать пользователю сохранить его.

Answer 1

Вы не можете сделать это чисто в HTML.Javascript должен был бы обработать проверку.Формы HTML5 не будут отправлены, если у вас есть обязательное поле пустым, так как браузеры обрабатывают их.Вы можете добавить novalidate к форме в качестве атрибута, но вам все равно понадобится некоторый javascript для обработки, показывающий предупреждающий знак

. Вот рабочий fiddle , чтобы показать вам, как выможет использовать JS для отображения предупреждения:

$('[name="e1_alt"]').blur(function(e) {
    var value = $(e.currentTarget).val();

  if (value.length === 0) {
    $('.error').show();
  }
});