Экземпляр JavaScript, который обнаруживает данные формы, очень прост и практично. Заинтересованные друзья могут посмотреть
<! Doctype html> <html> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> один экземпляр Javascript в день-обнаружение данных формы </title> <style> [role = "alert"] {founal-color: #fcc; шрифт-вес: жирный шрифт; Заполнение: 5px; Граница: 1px пунктир #000; } div {margin: 10px 0; Заполнение: 5px; Ширина: 400px; фоновый цвет: #fff; } </style> <script> window.onload = function () {document.getElementById ("третьяфилд"). OnChange = validatefield; document.getElementbyId ("Firstfield"). OnBlur = AltoaryField; document.getElementbyId ("testform"). onSubmit = finalCheck; } function validatefield () {removealert (); if (! isnan (parsefloat (this.value))) {resetfield (this); } else {badfield (this); GenerateAlert («Вы ввели неверное значение в третьем поле. Разрешены только числовые значения, такие как 105 или 3,45»); }} function removeAlert () {var msg = document.getElementById ("msg"); if (msg) {document.body.removechild (msg); }} функция ResetField (elem) {elem.parentnode.setattribute ("style", "founal-color: #fff"); var Valid = elem.getAttribute ("aria-invalid"); if (value) elem.removeattribute ("aria-invalid"); } function badfield (elem) {elem.parentnode.setattribute ("style", "foanle-color#feet"); elem.setattribute ("aria-invalid", "true"); } function generateAlert (txt) {var txtnd = document.createTextNode (txt); msg = document.createElement ("div"); msg.setattribute («Роль», «предупреждение»); msg.setattribute ("id", "msg"); msg.setattribute ("class", "alert"); msg.appendchild (txtnd); document.body.appendchild (msg); } function moardatoryfield () {removealert (); if (this.value.length> 0) {resetfield (this); } else {badfield (this); GenerateAlert («Вы должны ввести значение в первое поле»); }} function finalcheck () {//console.log("aaa "); RemoveAlert (); var fields = document.queryselectorall ('input [aria-invalid = "true"]'); // var fields = document.queryselectorall ("input [aria-invalid = 'true']"); // ошибка! ! ! console.log (поля); if (fields.length> 0) {generateAlert («У вас есть неверные записи Fields, которые должны быть исправлены, прежде чем вы сможете отправить эту форму»); вернуть ложь; }} </script> </head> <body> <form id = "testform"> <div> <label для = "Firstfield">*First Field: </label> <br/> <input id = "firstfield" = "firstfield" type = "text" aria-required = "true"/> </div> <div> <babel for for type = "necond field: </true"/> </div> <div> <div> <div> <div> <div> <div> <div> <babel для = " id="secondfield" name = "secondfield" type = "text" /> </div> <div> <label for="thirdfield">Third Field(numeric):</label><br /> <input id="thirdfield" name = "thirdfield" type = "text" /> </div> <div> <label for="fourthfield">Fourth Field:</label><br /> <input id="fourthfield" name = "Четвертый поле" type = "text"/> </div> <input type = "Отправить" value = "Отправить данные"/> </form> </body> </html>