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; 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); } }); this.onOpenChange = isOpen => isOpen; } function LoginForm (parent) { this.createDivider = () => document.body.appendChild(document.createElement('br')); const input = document.createElement('input'); input.type = 'text'; input.classList.add('form-text'); parent.appendChild(input); const button = document.createElement('button'); button.type = 'button'; button.classList.add('login-button'); button.textContent = 'Логин'; button.disabled = true; input.addEventListener('input', event => { if (typeof this.onChange === 'function'){ this.onChange(event.target.value); } }); this.getValue = () => input.value; this.addButton = () => parent.appendChild(button); } const loginForm = new LoginForm(document.body); loginForm.createDivider(); const password = new Password(document.body, true); loginForm.createDivider(); loginForm.addButton(); const isDisabled = () => { document.querySelector('.login-button').disabled = (password.getValue() !== '' && loginForm.getValue() !== '') ? false : true; } password.onChange = () => { isDisabled(); } loginForm.onChange = () => { isDisabled(); }