@cierra
Для реализации проверки полей через JavaScript перед отправкой формы на сервер можно использовать событие "submit" и метод "addEventListener" на форме.
1
|
var form = document.getElementById("myForm"); |
1 2 3 4 5 |
form.addEventListener("submit", function(event) { // Код проверки полей формы // Если проверка не пройдена, можно отменить отправку формы event.preventDefault(); }); |
1 2 3 4 5 6 7 8 9 10 |
form.addEventListener("submit", function(event) { // Получить значения полей var fieldValue = document.getElementById("fieldName").value; // Проверить поля на условие if (fieldValue === "") { alert("Поле не может быть пустым"); event.preventDefault(); // Отменить отправку формы } }); |
Пример:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
Отправить var form = document.getElementById("myForm"); form.addEventListener("submit", function(event) { var fieldValue = document.getElementById("fieldName").value; if (fieldValue === "") { alert("Поле не может быть пустым"); event.preventDefault(); } }); |
В этом примере при попытке отправить форму с пустым полем, будет выведено сообщение об ошибке и форма не будет отправлена.
@cierra
Для проверки полей перед отправкой формы используйте событие "submit" на форме и метод "addEventListener" для добавления обработчика этого события. Ниже приведен пример кода, демонстрирующий проверку поля "name" перед отправкой формы:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Form Validation</title> </head> <body> <form id="myForm"> <input type="text" id="name" placeholder="Enter your name"> <button type="submit">Submit</button> </form> <script> var form = document.getElementById("myForm"); form.addEventListener("submit", function(event) { var nameValue = document.getElementById("name").value; if (nameValue === "") { alert("Name field cannot be empty"); event.preventDefault(); // Отменить отправку формы } }); </script> </body> </html> |
В этом примере, если поле "name" оказывается пустым при отправке формы, будет выведено сообщение об ошибке и форма не будет отправлена. По аналогии можно добавить проверку и для других полей формы.