function Password(parent, open) { const input = document.createElement('input'); input.type = 'password'; parent.appendChild(input); const button = document.createElement('button'); button.type = 'button'; button.textContent = 'показать'; parent.appendChild(button); button.addEventListener('click', () => { this.setOpen(open !== true); }); this.setValue = newValue => input.value = newValue; this.getValue = () => input.value; this.setOpen = openUpdate => { open = openUpdate; if(typeof this.onOpenChange === 'function') { this.onOpenChange(openUpdate); } button.textContent = (openUpdate) ? 'показать' : 'скрыть'; input.type = (openUpdate) ? 'password' : 'text'; } this.getOpen = () => open; input.addEventListener('input', event => { if (typeof this.onChange === 'function'){ this.onChange(event.target.value); } }); } function LoginForm () { const createDivider = () => document.body.appendChild(document.createElement('br')); const input = document.createElement('input'); input.type = 'text'; input.classList.add('form-text'); document.body.appendChild(input); createDivider(); const password = new Password(document.body, true); createDivider(); const button = document.createElement('button'); button.type = 'button'; button.classList.add('login-button'); button.textContent = 'Логин'; button.disabled = true; document.body.appendChild(button); const isDisabled = () => { button.disabled = (password.getValue() !== '' && input.value !== '') ? false : true; } password.onChange = () => { isDisabled(); } input.addEventListener('input', () => { isDisabled(); }); } LoginForm();