Password Visibility - Multiple Forms
✓ Published0🌍 Public
Aangusgrant
Last edited Oct 15, 2022
Created on Oct 15, 2022
This example demonstrates a password visibility toggle across two separate forms: one for changing a username and another for changing a password. Each form contains a checkbox that, when checked, reveals its associated password fields as plain text. The page uses a single delegated click event listener on the document, which checks whether the clicked element matches either checkbox ID via `event.target.matches()`. It then traverses the DOM with `closest()` and `querySelectorAll()` to target only the password inputs within that form, switching their `type` attribute between `"password"` and `"text"` based on the checkbox state. The code uses vanilla JavaScript and standard HTML form elements, with no external libraries.
AI-generated description