Quando muitos amigos formam a verificação, eles usam jQuery ou JS manualmente ou usam o plugue jQuery -in para verificar. Porque todo mundo acha que o HTML5 vem com autenticação não é muito bom! De fato, agora o HTML5 vem com a verificação de formulários formulando, que agora é bastante poderosa. Vamos dar uma olhada em um formulário para verificá -lo de uma forma escrita por HTML5 puro! Experiência!
O que você acha desse efeito?
A essência desse efeito são três fotos!
.myform Selecione: requerido, .myform Entrada: Necessário. % Center;}. /Right.png) Centro de 99% de repetição; : //sandbox.runjs.cn/uploads/rs/216/0y89gzo2/error.png) No-repetição de 99%;
Então fez um evento de monitoramento:
OnInValid = this.setCustomvalidity ('Digite o número correto');Quando a senha de verificação for consistente, use um JS
Função checkpassword () {var pass1 = document.getElementById (senha);Isso completa o efeito!
Se você pensa, essa bolha construída também é feia! Como mostrado abaixo: eu quero alterá -lo!
Antes da versão do Google 29, podemos usar pseudo -elementos para modificar as bolhas!
: -Webkit-Validation-bubble {Min-lar: 152px; / TOP: 4px; 1px sólido #f7ce39;Mas, esse método foi abandonado mais tarde! Você descobrirá que não há resposta para modificar a bolha! Então, como modificar o estilo de bolha? É um pouco problemático aqui! A idéia é provavelmente que paramos as bolhas padrão e depois criamos uma nova bolha!
Evite bolhas padrão <form> <input Necessário> <butter> Envie </botão> </mand> <cript> document.quryselector (input) .addeventListener (incret, function) {event.prev entdefault ();}); Crie uma nova interface do usuárioO código é aproximadamente o seguinte:
Função Substituir Validação (Formulário) {// Impede bolhas de bolhas. }); Tipo = submeter]); invalidfields.length; /li>;} AGES.innerhtml = listhtml; Am ResumirO acima é que o HTML5 vem com o HTML5, verificando a otimização da experiência e a função de modificação de bolhas. Espero que seja útil para todos. . Muito obrigado pelo seu apoio ao site VevB Wulin!