Powiedzmy, że mam formularz logowania z loginem i hasłem. Oba są takie same i chcę wprowadzić wartość w trzecim polu wprowadzania tekstu i aktualizować wartości loginu i hasła podczas wpisywania.

Jak mogę to zrobić, używając tylko niewielkiej ilości JavaScript i HTML?

0
Gabriel Teixeira 20 grudzień 2019, 02:38
Przydałby się konkretny przykład. Jest to również bardzo szerokie i teoretyczne, ponieważ Stack Overflow dotyczy konkretnego problemu. stackoverflow.com/help/on-topic
 – 
mathmaniac88
20 grudzień 2019, 02:44
1
 – 
Diego Favero
20 grudzień 2019, 02:44

2 odpowiedzi

Jeśli masz to:

<html>
    <body>
        <input type='text' id='login'/>
        <input type='password' id='password'/>
        <input type='text' id='update'/>
    </body>
</html>

Możesz zrobić coś takiego:

<script>
    var login = document.getElementById('login'),
        password = document.getElementById('password'),
        update = document.getElementById('update');

    update.addEventListener('change', function() {
        login.value = update.value;
        password.value = update.value;
    });
</script>

Musisz dodać zdarzenie dla trzeciego wejścia, a następnie za każdym razem, gdy się zmieni, musisz zaktualizować login i hasło do ich aktualnej wartości.

Nie testowałem tego kodu, więc nie używaj go tak, jak jest, zrobiłem to, aby pokazać przykład.

1
Matriarx 20 grudzień 2019, 02:56

Możesz dodać detektor zdarzeń do pola tekstowego, w którym użytkownik pisze dla zdarzenia keypress. Po naciśnięciu klawisza możesz następnie zastosować bieżącą wartość pola tekstowego do docelowego pola tekstowego.

document.getElementById('txtType').addEventListener('keyup', e => {
  const copyTextInput = document.getElementById('txtCopied');
  copyTextInput.value = e.target.value;
});
<label for="txtType">Type Here</label>
<input id="txtType" />
<br />
<label for="txtCopied">Copied Text as you're typing</label>
<input id="txtCopied" />
0
mwilson 20 grudzień 2019, 03:05