본문으로 바로가기

[jQuery] input checkbox 이벤트 실행

로딩중..
2016.03.08 23:02

오늘은 거의 역대급.. 뻘짓..작업(?) 시간 낭비..

지금 이글을 적으면서도 왜했지? 라는 생각이 드는 ㅠ_ㅠ


input type="checkbox" 의 이벤트 실행하는 함수입니다.


라이브리 댓글 토글 버튼 디자인 구경하다가 완전 깜찍한 토글 버튼을 발견해서

저녁 내내 ㅠ_ㅠ 갖다 붙여넣기 했는데

뭔가 괜히 찝찝한 느낌입니다...


며칠 이내로 때버릴 것 같네요. 그래도 언젠가는 쓸일이 있겠지..


특징이라면 .attr() 안돼서 .prop() 요걸로 했다는... 차이점은... 구글 ㄱㄱ!!


See the Pen input checkbox 이벤트 by JCM (@cocosoft) on CodePen.



	//토글키
	$('#toggle--daynight').on('click', function() {
	  if ( $(this).prop('checked') ) {
		$("#expand-checkedbox-content").css("background", "#72DFD5");
		$(".youtube1").removeClass("youtubedisplaynone");
	  } else {
		$("#expand-checkedbox-content").css("background", "transparent");
		$(".youtube1").addClass("youtubedisplaynone");
	  }
	});

	$('#toggle--like').on('click', function() {
	  if ( $(this).prop('checked') ) {
		$("#expand-checkedbox-content").css("color", "#fff");
	  } else {
		$("#expand-checkedbox-content").css("color", "#ff3535");
	  }
	});


댓글을 달아 주세요

  1. BlogIcon SONYLOVE 2016.03.08 23:34 신고

    완전 이쁜데요. 잘만 쓰면 굉장히 멋질꺼 같은데요. 나중에 하다보면 언젠가는 유용하게 써먹을 때가 오지 않을까요. ㅎㅎ

    • BlogIcon COCOSOFT COCO Media 2016.03.08 23:58 신고

      체크박스는 나중에도 사용할일이 많으니 유용하게 사용가능할 것 같아요 다만.. pure CSS 코드만 찾다가 너무 코드가 길어지네요;; 이미지로 할때도 좋을 때가 있는 것 같아요ㅎㅎ

티스토리 툴바