프론트엔드/제이쿼리12 [제이쿼리] 그룹이벤트 메서드 생성, 삭제(on, bind,delegate,one) 그룹 이벤트 등록 및 삭제 한번에 여러개의 이벤트를 등록하는 방법은 그룹 이벤트 메서드를 사용하는 것이다. 그룹 이벤트 등록 메서드 종류는 다음과 같다. 그룹 이벤트 등록 메서드 ✔️종류 ❔ 설명 on() 이벤트 대상 요소에 2개 이상 이벤트 등록, 사용방식에 따라 이벤트 등록한 이후에도 동적으로 생성되거나 복제된 요소에도 적용됨 bind() 이벤트 대상 요소에 2개 이상 이벤트 등록 delegate() 선택 요소의 하위 요소에 이벤트 등록. 이벤트 등록한 이후에도 동적으로 생성되거나 복제된 요소에도 적용됨 one() 이벤트 대상 요소에 1개 이상 이벤트 등록, 지정 이벤트가 1회 발생하고 자동 해제 라이브 이벤트 등록방법 - 이벤트 등록을 한 후에 해당 클래스 값을 생성하려고하면 오류가 난다. 하지만 .. 2023. 6. 26. [제이쿼리] 키보드이벤트(focus, blur, focusin, focusout) 1. 포커스 이벤트 키보드 [tab]을 눌렀을때 노란색 윤곽선이 생기는걸 볼 수 있다. 클릭과 다른 상태로 키보드로 포커싱을 준 상태이다. 만약 mouseover focus 효과를 준다면 마우스를 갖다 대거나 [tab]키로 해당 요소를 선택했을 때 이벤트가 발생한다. ✔️종류 ❔설명 focus() 대상요소로 포커스 이동하면 이벤트 발생 blur() 포커스가 대상 요소에서 다른 요소로 이동하면 이벤트 발생 ( mouseover과 비슷 ) focusin() 대상요소의 하위 요소 중 입력 요소로 포커스가 이동하면 이벤트 발생 focusout() 대상요소의 하위요소 중 입력요소에서 외부요소로 이동하면 발생 위 코드에서 첫번째 버튼은 focus 이벤트가 없다. 마우스 관련 동작시에만 이벤트가 발생한다. 두번째 버.. 2023. 6. 26. [제이쿼리] 마우스 이벤트 마우스 이벤트는 마우스로 클릭하거나 특정 범위에 올려놓았을 때 등 상황에서 발생한다. 1. click(), dblclick() 이벤트 메서드 - click(): 선택 요소를 클릭했을 때 이벤트 발생 - dblclick(): 선택 요소를 두번 연속 클릭했을 때 이벤트 발생 2. , 태그에 클릭 이벤트 적용시 기본이벤트 차단 click이나 dbclick을 등록하였을 때 에 속성에 있는 링크, 요소에 있는 제출 버튼의 action이 발생하는 문제를 차단한다. 방식은 두가지가 있다. - return false 이용 $("a또는 form").이벤트메서드(function() { code; retrun false; }); - preventDefault 이용 $("a또는 form").이벤트메서드(function(e) .. 2023. 6. 26. [제이쿼리] 이벤트메서드(로딩이벤트, 마우스 이벤트), 강제실행, 제거 사용자의 동작, 모든 행위를 이벤트라고 부른다. 이 이벤트가 발생했을 때 실행되는 코드는 이벤트 핸들러라고 부른다. 이 이벤트 등록 메서드에는 단독이벤트와 그룹이벤트 메서드가 있는데 개수를 기준으로 나뉜다. 🟡 단독 이벤트 메서드: 한 동작을 등록 $("이벤트 대상 선택").이벤트 등록 메서드(function() { code; }); 버튼 $(".btn1").click(function() { code; }); 🟡 그룹 이벤트 등록 메서드 : 2개 이상 이벤트를 등록, 3가지 방식이 있다. // 첫번째 방식 $(".btn").on("mouseover",function() { code; }) // 두번째 방식 $(".btn").on({ "mouseover" : function() { code; } }); /.. 2023. 6. 23. 이전 1 2 3 다음
