Βιβλίο
Υποενότητα 9.3 Επικύρωση φόρμας
Υποενότητα 9.3 Επικύρωση φόρμας
Απαιτήσεις ολοκλήρωσης
Προβολή
- HTML validation
- JavaScript validation
Προσθήκη λειτουργιών JavaScript
Το στοιχείο input type="email"
Ο παρακάτω κώδικας δημιουργεί την επικύρωση για την input type="email".
Σύμφωνα με την είσοδο του χρήστη, εμφανίζει το κατάλληλο χρώμα περιγράμματος. Εμφανίζει επίσης το κατάλληλο μήνυμα στην περιοχή span με το id "mailInfo"
Ο κώδικας HTML:
<div class = "required">
<label for="mail">Your email:</label>
<input type="email" name="mail" id="mail"
placeholder="Your email goes here" required />
<span id="mailInfo"></span>
</div>
και ο κώδικας the JavaScript:
<script>
var mymail = document.getElementById("mail");
var mymailInfo = document.getElementById("mailInfo");
mymail.oninput = function () {
if (!this.validity.valid) {
mymail.style.border="solid 3px red";
mymailInfo.innerHTML="Your email must be in the correct format. "
}
else {
mymail.style.borderColor = "green";
mymailInfo.style.display = "none"
}
}
</script>
θα δημιουργήσουν μια σελίδα που εμφανίζεται ως: