Uma instância de JavaScript que detecta os dados do formulário é muito simples e prática. Amigos interessados podem dar uma olhada
<! Doctype html> <html> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> uma instância javascript por dia-detectar dados de dados </title> <style> [role = "alert"] {Borden-corlor: Peso da fonte: negrito; preenchimento: 5px; Fronteira: 1px tracejado #000; } div {margem: 10px 0; preenchimento: 5px; Largura: 400px; Background-Color: #FFF; } </style> <cript> window.onload = function () {document.getElementById ("terceirofield"). OnChange = validatefield; document.getElementById ("Firstfield"). Onblur = MandatoryField; document.getElementById ("testForm"). OnsubMit = finalCheck; } function validEfield () {removealert (); if (! isnan (parsefloat (this.value))) {redetfield (this); } else {badfield (this); Generatealert ("Você inseriu um valor inválido no terceiro campo. Somente valores numéricos, como 105 ou 3,45, são permitidos"); }} função removealert () {var msg = document.getElementById ("msg"); if (msg) {document.body.removechild (msg); }} Função ResetField (elem) {elem.parentnode.setAttribute ("style", "cor de fundo: #fff"); var válido = elem.getAttribute ("ARIA-Invalid"); if (válido) elem.removeattribute ("aria-invalid"); } função badfield (elem) {elem.parentnode.setattribute ("style", "color de fundo#taxa"); elem.setattribute ("ARIA-Invalid", "True"); } função generatealert (txt) {var txtnd = document.createTextNode (txt); msg = document.createElement ("div"); msg.setattribute ("função", "alerta"); msg.setAtattribute ("id", "msg"); msg.setattribute ("classe", "alerta"); msg.appendChild (TXTND); document.body.appendChild (msg); } função obrigatória () {removealert (); if (this.value.length> 0) {redetfield (this); } else {badfield (this); generatealert ("você deve inserir um valor no primeiro campo"); }} function finalCheck () {//console.log("aaa "); removealert (); var fields = document.QuerySelectorAll ('entrada [aria-invalid = "true"]'); // var fields = document.QuerySelectorAll ("entrada [aria-invalid = 'true']"); // erro! ! ! console.log (campos); if (fields.length> 0) {generatealert ("Você tem entradas de campos incorretas que devem ser corrigidas antes de enviar este formulário"); retornar falso; } } </script> </head> <body> <form id = "testform"> <div> <label for="firstfield">*first Field:</label><br /> <input id="firstfield" name = "firstfield" type = "text" aria-required = "true" /> </div> <div> <label for="secondfield">Second Field:</label><br /> <input id="secondfield" name = "Secondfield" type = "text" /> </div> <div> <etiqueta para = "terceiro campo"> terceiro campo (numérico): </elabel> <r /> <input id = "terceiro" name = "terceiro" type = "text" /> < /> < /div> <div> <bel para = "Fourthfield"> Fourth Field: < /> <r /> </div> <input type = "submit" value = "enviar dados"/> </form> </body> </html>