JS (Java Script)

e.originalEvent.dataTransfer.setData()

GABOJOK 2023. 8. 31. 16:00

e.originalEvent

jQuery 에서 어떤 이벤트 처리할때 W3C 표준에 맞게 정규화 한 새로운 객체를 생성해 전달한다. 

이 정규화 된 jQuer.Event 객체 덕분에, 브라우저 별로 차이가 있는 이벤트에 대해 동일한 방법으로 사용이 가능하다. 

이것을 우리는 크로싱 브라우저 지원 이라고 한다. 

 

실제 브라우저에서 발생한 이벤트 객체인 순수한  DOM 이벤트 객체는 '네이티브 객체', 혹은 '브라우저 내장 객체' 라고 한다. 

이 가공되지 않은 '브라우저 내장 객체'는 표준화 된 객체보다 더 많은 정보를 가지고 있다

그리고 e.originalEvent 속성을 이용해서 '브라우저 내장 객체' 에 접근 할 수 있다. 

 

.dataTransfer.setData('이름', 저장하려는 데이터)

드래그 앤 드롭 이벤트리스너 를 사용할 때에, 데이터를 몰래 저장했다가 꺼내 사용할 수 있다.

.dataTransfer.setData('이름', 저장하려는 데이터)  혹은 .getData('이름', 꺼내쓰려는 데이터)

 

이 기능은 "브라우저 내장 객체"에 의존하고 있기 때문에, "브라우저 내장 객체" 에 접근해야 한다. 

그래서 e.originalEvent.dataTransfer.setData() 이렇게 쓰면 내가 원하는 데이터 몰래 저장 가능함.

 

참고로 e 이거 사용해야 하니까 함수 파라미터 값으로 e  꼭 넣어주어야함.