In JavaScript possiamo evidenziare le label dei form quando i campi ricevono il focus.
La soluzione รจ la seguente:
'use strict';
const highlightLabelOnFocus = form => {
let elements = form.querySelectorAll('.form-control');
Array.prototype.forEach.call(elements, element => {
let label = element.previousElementSibling;
element.addEventListener('focus', () => {
label.classList.add('focus-highlight');
}, false);
element.addEventListener('blur', () => {
label.classList.remove('focus-highlight');
}, false);
});
};
Esempio d'uso:
document.addEventListener('DOMContentLoaded', () => {
highlightLabelOnFocus(document.querySelector('#form'));
});