event

input 붙여넣기 방지하기

때로는 보안과 같은 이유로 input에 붙여넣기가 허용되지 않을 수 있다. 이 경우, 붙여넣기 이벤트를 탐지하고 해당 이벤트가 제대로 작동하지 못하도록 해주어야 한다. 이번엔 이를 어떻게 구현할 수 있을지 알아보았다. 다음과 같이 input이 있다. 이 input에 붙여넣기를 허용하지 않기 위해서는 어떻게 해야할까? eventListner를 사용하면, 이를 간단하게 구현할 수 있다. const input = document.querySelector("input"); input.addEventListener('paste', (event) => { event.preventDefault(); alert("!") }); paste 이벤트가 발생하였을 때, 기존의 이벤트를 없애고 알림창을 띄운다. 만약 당신이 위..

브라우저 Scroll Event 사용하기

요즈음 웹 사이트들은 스크롤을 통한 이벤트 발생을 많이 일으키는 것 같다. 그리고 그 기본은 스크롤의 변화를 탐지하여 현재 사용자가 보고있는 페이지를 확인하는 것이다. 모바일 웹에서 흔히 사용되는 무한 스크롤 역시, 컴포넌트의 위치와 현재 사용자가 보고 있는 스크롤 위치를 파악하여 마지막에 도달하였을 때 자동으로 서버로 요청을 보내어 새로운 데이터를 가져오는 것 이다. 현재까지 사용자가 스크롤해온 값은 window.pageYOffset이나 window.scrollY로 확인할 수 있다. window.pageYOffset은 deprecated 되었다고 알려졌지만, IE 환경을 고려한다면 이를 사용해야 한다. window.scrollY는 window.pageYOffset와 같은 값을 가지므로, window.p..