tr 에 click event(onclick 포함)을 걸었을 때 포함된 checkbox 는 이벤트에서 제외하는 방법 - jquery 이용

예전(2012년 8월 23일 목요일)에 제가 적었던 블로그 내용을 옮겨왔습니다.

첫번째. 가장 쉬운 방법

$("input[type=checkbox]").click(function(event) {
	event.stopPropagation();
});

jquery 에서 event.stopPropagation() 을 제공함. 하지만 모든 이벤트를 멈춰버리니 주의.

두번째. 이벤트를 등록할 때 checkbox 는 빼고, checkbox 만 별도로 이벤트 등록하는 방법

$("tr").click(function(event) {
	if (event.target.type == 'checkbox')
		return;
	
	// TODO tr 눌렀을 때 취할 행동. 물론 실무에선 selecter 를 더 한정적으로 써야함
});

$(":checkbox").change(function(event) {
	// TODO checkbox 눌렀을 때 취할 행동
});

세번째. 첫번째와 두번째를 응용

$("tr").click(function(event) {
});

$(":checkbox").click(function(event) {
	event.stopPropagation();
});

네번째. click 이벤트가 안먹힐 때가 있다. 이럴 경우 delegate 을 이용.

$('#TableID').delegate('tr', 'click', function (event) {
	if($(event.target).is('input:checkbox')) {
	} else {
	}
});

역시 jquery 의 세계는 오묘하다...