Display the text typed in the form by clicking the submit button
const form = document.querySelector('form'); const taskInput = document.getElementById('task'); // Clear input taskInput.value = ''; form.addEventListener('submit', runEvent); function runEvent(e) { //console.log(`EVENT TYPE: ${e.type}`); // Get input value console.log(taskInput.value); e.preventDefault(); }
Input events
const form = document.querySelector('form'); const taskInput = document.getElementById('task'); const heading = document.querySelector('h5'); const select = document.querySelector('select'); // Clear input taskInput.value = ''; form.addEventListener('submit', runEvent); // Keydown taskInput.addEventListener('keydown', runEvent); // Keyup taskInput.addEventListener('keyup', runEvent); // Keypress taskInput.addEventListener('keypress', runEvent); // Focus taskInput.addEventListener('focus', runEvent); // Blur taskInput.addEventListener('blur', runEvent); // Cut taskInput.addEventListener('cut', runEvent); // Paste taskInput.addEventListener('paste', runEvent); // Input taskInput.addEventListener('input', runEvent); // Change select.addEventListener('change', runEvent); function runEvent(e) { console.log(`EVENT TYPE: ${e.type}`); // Get input value console.log(taskInput.value); console.log(e.target.value); heading.innerText = e.target.value; e.preventDefault(); }
Leave a Reply