[jQuery] 여러 요소 셀렉트 및 이벤트 바인딩

0후·2022년 2월 23일
0

프론트엔드

목록 보기
20/41

한 요소 셀렉트

$('AAA').click(function () {
  //하나의 이벤트 밖에 바인딩할 수 없다.
});

여러 요소 셀렉트

$('AAA, BBB, CCC').on('XXX', function () {
  // 여러 요소를 한 번에 잡을 수 있다.
});

한 요소 한 개의 이벤트 바인딩

$('AAA').on('mousedown', function () {
  // 한 요소에 mousedown 이벤트가 적용된다.
})

여러 요소 여러 개의 이벤트 바인딩

$('AAA, BBB, CCC').on('click hover', function () {
  // 여러 요소에 click 이벤트와 hover 이벤트가 적용된다.
})

객체 형식으로 이벤트 바인딩

$('AAA').on({
  click: function () {
    // 이벤트 내용
  },
  mouseenter: function () {
    // 이벤트 내용
  },
  keydown: function () {
    // 이벤트 내용
  }
});

요소 안에 있는 요소에 이벤트 바인딩

$('AAA').on('click', 'p', function(){
	// AAA 태그 안 p 태그를 지정해서 p 클릭 시 이벤트 발생
});
profile
휘발방지

0개의 댓글