▶ 이벤트 동작 취소 실습
copy 이벤트 동작 취소
콘텐츠를 복사하는 것을 방지한다
| copy 이벤트 동작 취소 |
 |
| form 제출 시 페이지 새로고침 동작 취소 form 요소의 submit 동작 (action 값으로 요청)을 취소시킨다 |
  |
더보기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>중요한 내용</h1>
<form id="my-form">
<input type="text" name="username">
<button type="submit">Submit</button>
</form>
<script>
// 1
const h1Tag = document.querySelector('h1')
h1Tag.addEventListener('copy', function (event) {
console.log(event)
event.preventDefault()
alert('복사 할 수 없습니다.')
})
// 2
const formTag = document.querySelector('#my-form')
const handleSubmit = function (event) {
event.preventDefault()
}
formTag.addEventListener('submit', handleSubmit)
</script>
</body>
</html>▶ 출력
'WEB > JavaScript' 카테고리의 다른 글
| [JavaScript][비동기] 동기 (0) | 2024.04.23 |
|---|---|
| [JavaScript][Event] addEventListener에서의 화살표 함수 주의사항 (0) | 2024.04.22 |
| [JavaScript][Event] 이벤트 기본 동작 취소 (0) | 2024.04.22 |
| [JavaScript][Event] lodash (0) | 2024.04.22 |
| [JavaScript][event handler 활용] 5. 로또 번호 생성기 실습 (0) | 2024.04.22 |