JavaScript/JQuery

자식 이벤트 실행할 때 부모 이벤트 실행 무시하기

기본적으로 jQuery 마우스 이벤트를 등록하면 자식 엘리먼트에게 이벤트를 전파한다. 이벤트가 전파된 자식 엘리먼트에서 이벤트를 등록하여 실행하면 부모 엘리먼트의 이벤트가 실행되는 현상이 일어난다. 이것을 막고, 자식이벤트만 실행하게 하려면 event.stopPropagation() 함수를 사용하면 더이상 부모이벤트의 함수는 실행되지 않는다.

2022. 10. 12. 10:15

JavaScript/JQuery

[jQuery] checkbox 다중 체크값 가져오기

var receiverArr = []; // 체크박스의 name을 잡아 체크된 element의 value 값을 가져옴 $("input[name=receiver]:checked").each(function() { var chkReceiver = $(this).val(); receiverArr.push(chkReceiver); }); console.log("receiver : " + receiverArr);

2022. 9. 26. 14:57

JavaScript/JQuery

[jQuery] .load() 메서드

웹페이지의 내용을 동적으로 교체할 수 있는 메서드이다. 서버에서 json 데이터를 받아 Ajax로 HTML 요소를 생성하여 페이지 내부의 원하는 위치에 내용을 변경할 때 사용한다. 주어진 URL로부터 HTML 데이터를 받아 선택한 공간에 넣어줌으로써 동적인 변화를 나타낸다. load 메서드의 3가지 매개변수 .load(url [, data] [, compleat]) 1) url : 데이터를 받을 url 2) data URL 요청을 보낼 때 같이 보낼 데이터로써 자바스크립트 객체 또는 문자열을 말한다. data가 주어진다면 POST 메서드로 전송되고 이외의 경우에는 GET 방식으로 보내진다. 3) complete : 요청 완료 후 호출 될 콜백함수 콜백이 제공되었을 경우 후처리와 HTML 삽입이 수행된 후..

2022. 9. 14. 14:20