Проверка заполнено ли поле на jQuery

9:25 11.06.2017
Сегодня писал небольшое расширение для форума, которое должно проверять заполнено ли поле или нет, если поле осталось пустым, то выводим ошибку, если поле заполнено, введено необходимое количество символов, то ни каких ошибок не выводим и сценарий переходит к дальнейшим операциям.

После того, как сработает событие submit, то есть будет нажата кнопка, уберем пробелы в начале и в конце строки trim, получаем количество введенных символов и если все верно, то сценарий приступит к дальнейшей обработке. Если же символов будет меньше заданного, выводим сообщение об ошибке и останавливаем сценарий. Для выполнения кода ниже необходимо подключить jQuery.

И так, например у нас есть такая форма:
<div id="error"></div>
<form id="form" action="script.php">
    <input id="field" type="text">
    <input type="submit" value="Ввод">
</form>

Над формой у нас блок с идентификатором error, в этом блоке будет появляться сообщение об ошибке, в случаи, если поле было заполнено неверно. Далее форма с идентификатором form, в этой форме поле, идентификатор которого field. По идентификаторам мы и будем производить проверку.
Теперь сам JavaScript (прокомментированный):
<script type="text/javascript">
$('#form').submit(function()  // Нажата кнопка
{
    var string = $('#field').val(); // Получаем строку с поля
    string = $.trim(string);        // Убираем пробелы
    
    if (string.length < 3)          // Сравниваем количество с заданным
    {                               // Если символов меньше трех
        var error = 'Заполните поле, должно быть не менее трех символов.';             // Текст ошибки
        $('#field').css({'background-color' : '#FCDCDC', 'border-color' : '#BC2A4D'}); // Стиль поля при ошибки    
        $('#error').html(error); // Выводим сообщение в блок над формой error

        return false;            // Останавливаем действие, что бы страница не перезагружалась
    }    
});
</script>