HTML 5 popup del browser su input con type = "email"

Question

Quando si invia un modulo nella versione più recente del browser che supporta il markup HTML5 e il modulo ha input type="email" con valore di indirizzo e-mail non valido, il modulo non verrà inviato che è buono. Inoltre riceverai un avviso di bolla che dice "Please enter an email address"

Un semplice DEMO here.

Bene, questo è bello in qualche punto. Nella demo vedrai che il pop-up nasconde il mio errore definito. C'è un modo per impedire la comparsa della bolla? o posso sovrascrivere lo stile della bolla?

Answer 1

Ci si può fermare build-in del browser di convalida con l'attributo novalidate:

<form action="" novalidate></form> 

oppure è possibile modificare il contenuto della sovrapposizione con questo JavaScript proprietà e il vostro messaggio di errore proprio:

var element = [selector that selects the input field]; 
element.setCustomValidity('This is not a valid e-mail'); 

Ma penso che non si possa progettare questo elemento del browser da soli.