javascript-24: submit

submit

    <form id="login-form">
      <input
        type="text"
        placeholder="What is your name?"
        required
        maxlength="15"
      />
      <input type="submit" value="Log In" />
    </form>

const loginInput = document.querySelector("#login-form input");
const loginForm = document.querySelector("#login-form");

function onLoginSubmit(event) {        //
  tomato.preventDefault();     //초기화 막기
  console.log(event);
}

loginForm.addEventListener("submit", onLoginSubmit);

• 입력창에서 enter 또는 Log In을 클릭시 submit이 됨
• 이때 브라우저는 새로고침을 하게 되는데 이것을 막는게 prevent.default
• 이 preventDefault 함수는 EventListener 함수의 ‘첫 번째 argument’ 안에 있는 함수이다.
• 첫 arument는 지금 막 벌어진 event들에 대한 정보를 갖고 있다.
• JS는(기본적으로)argument를 담아서 함수를 호출하는데, 이 argument가 기본 정보들을 제공하고 있다.
  • ex) 누가 submit주체인지, 몇 시에 submit을 했는지 등등 콘솔에 출력해보면 알 수 있음