[ajax] 요소 선택시 $(this) 선택 안될 때

 

안녕하세요 주갬입니다.

 

오늘은 jQuery를 이용할 때 유용하게 사용할 수 있는 $(this)가 안먹을 때의 해결방법에 대해 말씀드리려고 합니다.

 

 

---

 

 

 

위 사진에는 같은 클래스명을 가진 DELETE버튼이 여러개 생성되어 있습니다.

 

이처럼 같은 클래스명인 요소들에 하나씩 접근하는 경우, jQuery의 $(this)로 원하는 요소에 접근하여 각종 명령을 수행하게 됩니다.

 

 

하지만 ajax에서 그냥 $(this)를 쓰면 인식을 못하는 경우가 있습니다.

 

댓글 삭제 기능을 만들던 중 DELETE버튼을 누르면 댓글 전체를 지우는 작업을 해야했고

$(this).closest('.media-body'); 를 통해

delete버튼을 누르면 가까이 있는 'media-body'인 요소를 찾아 지우려 했지만 $(this)가 먹지 않아 삽질을 좀 했습니다.

 

 

 

 

 

 

---

 

인터넷을 뒤져 찾아낸 해결방법은 바로,,!

 

$.ajax({ ... })    안에

context: this,   를 추가 하는 것입니다!

 

 

 

 

해당 코드를 입력하시면 위의 jQuery 코드에서 사용한 $(this)가 가르키는 요소를 가져다 사용할 수 있습니다.

 

 

---

감사합니다!