Что отображать сообщение «Требуется имя пользователя и пароль»?

Я не знаю, как отобразить сообщение «Требуется имя пользователя и пароль»!

Когда я нажимаю "Отправить", он автоматически открывается на index.php.

Он должен отобразить меня Требуется имя пользователя и пароль

Вот мой код:

var username = document.form["vform"]["username"];
var email = document.form["vform"]["email"];
var password = document.form["vform"]["password"];
var password_confirmation = document.form["vform"]["password_confirmation"];



var name_error = document.getElementById("name_error");
var email_error = document.getElementById("email_error");
var password_error = document.getElementById("password_error");


username.addEventListener("blur", nameVerify, true);
email.addEventListener("blur", emailVerify, true);
password.addEventListener("blur", passwordVerify, true);



function Validate() {
    if (username.value == "") {
        username.style.border = "1px solid red";
        name_error.textContent = "Username is required";
        name.focus();
        return false;

    }


    if (email.value == "") {
        email.style.border = "1px solid red";
        email_error.textContent = "Email is required";
        email.focus();
        return false;

    }




    if (password.value == "") {
        password.style.border = "1px solid red";
        password_error.textContent = "Password is required";
        password.focus();
        return false;

    }


    // Check if two password match
    if (password.value != password_confirmation.value) {
        password.style.border = "1px solid red";
        password_confirmation.style.border = "1px solid red";
        password_error.innerHTML = "The two passwords don't match";
        return false;

    }
}


function nameVerify() {
    if (username.value != "") {
        username.style.border = "1px solid #5E6E66";
        name_error.innerHTML = "";
        return true;
    }
}


function emailVerify() {
    if (email.value != "") {
        email.style.border = "1px solid #5E6E66";
        email_error.innerHTML = "";
        return true;
    }
}


function passwordVerify() {
    if (password.value != "") {
        password.style.border = "1px solid #5E6E66";
        password_error.innerHTML = "";
        return true;
    }
}

Я не вижу, где ошибка, я думаю, это хорошо, нет синтаксической ошибки, возможно, что-то не хватает.

Почему бы вам не использовать такой плагин, как Validate.js? Он более гибкий и простой в использовании.

Vincent Decaux 22.10.2018 22:12
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
1
167
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Убедитесь, что в вашей форме есть обязательный атрибут (HTML5):

<input type = "text" name = "username" required />
<input type = "text" name = "password" required />

Нет необходимости в проверке JavaScript. Убедитесь, что вы проверили и на стороне сервера.

Спасибо, теперь работает! Но пароль другой, и сообщение не отображается!

Clément 22.10.2018 22:09

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

Jay Blanchard 22.10.2018 22:10

Это должен быть отдельный вопрос.

Jay Blanchard 22.10.2018 22:14

Другие вопросы по теме