JSFiddle - React, Tailwind, and code Playground
HTML
<form action="" name="form1">
<input type="submit">
</form>
<form action="" name="form2">
<input type="submit">
</form>
<pre id="out"></pre>
CSS
form {
padding: 1em;
outline: dashed 2px gray;
}
.blink {
animation: blinkingBackground 0.6s 2;
}
@keyframes blinkingBackground {
0% { background-color: #10c018; }
50% { background-color: #ef0a1a; }
100% { background-color: #04a1d5; }
}
JavaScript
document.addEventListener('submit', function(evt) { // общий обработчик
const form = evt.target; // <- вот она, форма
evt.preventDefault();
out.textContent = form.getAttribute('name');
form.classList.remove('blink');
void form.offsetWidth;
form.classList.add('blink');
});