#jquery #css #jquery-validate
#jquery #css #jquery-validate
Вопрос:
Я использую jquery validate для проверки 3 атрибутов (минимальная длина, максимальная длина, обязательно) в элементе.
<input id="jumbotronSearch" type="text" class="form-control input-lg" placeholder="Location" required maxlength="50" minlength="4"/>
Но когда отображается сообщение об ошибке, оно отображается черным, а не красным.
При просмотре других потоков и сайтов, которые демонстрируют и отображают сообщения об ошибках проверки, кажется, что сообщение должно быть красным, и граница элемента тоже будет красной!?? Должен ли я сам стилизовать это, или мне не хватает какого-то файла или параметра конфигурации для jquery validate, чтобы заставить tit отображаться красным цветом?
Вот как выглядит сообщение об ошибке, смотрите, сообщение черное, а не красное, и граница элемента не красная!
Комментарии:
1. В этот плагин не включены таблицы стилей. Если оно красного цвета, это не имеет никакого отношения к jQuery Validate.
2. Убедитесь, что ваш validation.js файл находится над файлом js, который вы используете для проверки ошибок, если он находится в отдельном файле. У меня была похожая проблема, когда мой js-файл, о котором идет речь, проверяющий форму на определенной странице, находился над validation.js file и поэтому это немного сбило меня с толку, поскольку другие журналы ошибок проверки были выделены красным, в то время как этот не был. Я просто переместил файл js, выполнив обработку ошибок ниже validation.js файл, и это сработало! Надеюсь, это поможет кому-то еще.
Ответ №1:
… кажется, что сообщение должно быть красным, и граница элемента тоже будет красной!?? Должен ли я стилизовать это сам…
Да, поскольку плагин не включает таблицу стилей CSS, вы должны оформить это самостоятельно.
По умолчанию этот плагин применяет вызываемый класс error к недопустимому элементу и его метке сообщения, а вызываемый класс valid — к проверяемому элементу.
ДЕМОНСТРАЦИЯ:jsfiddle.net/06cLoL8c /
Беглый взгляд на официальный сайт, и вы можете увидеть, что файлы CSS не включены:
При просмотре других потоков и сайтов, которые демонстрируют и отображают сообщения об ошибках проверки, кажется, что сообщение должно быть красным…
Эти другие люди, вероятно, используют фреймворки, такие как Bootstrap, которые могут включать CSS, который уже нацелен на .error и .valid классы. В противном случае вы можете использовать опции validClass и errorClass , чтобы переименовать эти классы во все, что пожелаете.
Вот та же демонстрация, что и выше, но с нелепым стилем, примененным в CSS:
Вы должны прочитать документацию для всех доступных опций плагина:jqueryvalidation.org/validate /
Комментарии:
1. @user1186050, я не знаю. Почему бы не прочитать документацию, на которую я ссылался, и соответствующим образом сопоставить классы?
2. Я не верю, что эффект, которого я добиваюсь (в основном выделение границы красным цветом), исходит от bootstrap. Я почти уверен, что это происходит из-за какого-то действия проверки.
3. @user1186050, плагин проверки не поставляется с CSS … он просто добавляет / удаляет классы
errorиvalid. Точка. Если вы считаете иначе, просто проверьте код , чтобы подтвердить факт.