728x90 300x250 SMALL javaScript/jQuery148 키보드 입력 시 클리어 버튼 $('.searchbox').on('focus', function(){ if ($(this).val() !== '') { $(this).parent('.searchWrap').addClass('active').attr('tabindex','0'); } }).on('input', function(){ $(this).parent('.searchWrap').addClass('active').attr('tabindex','0'); }) $('.searchWrap').on('mouseleave touchmove', function(){ $(this).removeClass('active').removeAttr('tabindex'); }); $('.ico-inputClear').on('click', function(.. 2023. 3. 17. jQuery 사용자 정의 이벤트2- 비공개 보호되어 있는 글 입니다. 2023. 3. 16. trigger 버튼 클릭 없이 이벤트 발생 시키기 trigger $대상.trigger("이벤트이름") 실제 버튼을 클릭하지않았지만 클릭 한것 같은 이벤트를 수동으로 발생시켜야 할경우 트리거 메서드를 사용할 수 있다. 버튼1 버튼2 위와 같이 2개의 버튼이 있다고 했을때 버튼1을 눌렀을때 버튼2도 클릭한 것 같은 효과를 줄 수 있다. ("#btn1").on("click",function(){ console.log("버튼1"); $("#btn2").trigger("click"); }) $("#btn2").on("click",function(){ console.log("버튼2"); }) 이처럼 trigger()메서드를 사용하면 수동으로 클릭하지 않은 버튼도 클릭하게 할 수 있다. 2023. 3. 14. [jQuery] event.target와 this의 차이 + 이벤트 위임 예시 event.target 이벤트가 발생한 정확한 지점에 대한 정보를 반환한다. event.target는 실제 이벤트가 시작된 target요소 버블링 되어도 변하지 않음 this(=event.curentTarget)는 현재 샐행중인 핸들러가 할당된 노드를 참조 이벤트 위임(event delegation) 요소마다 이벤트 핸들러를 할당하지 않고 공통 조상요소에 할당해서 한개의 이벤트 핸들러로 여러 요소를 한꺼번에 처리 할 수 있다. 공통 조상에 할당한 핸들러에서 event.target를 이용하면 실제 이벤트가발생한 위치를 알 수 있고 이를 이용해서 이벤트를 핸들링 할 수 있다. 하나의 이벤트 리스너로 여러 이벤트 처리하기 $대상.on("이벤트명", "선택자", 이벤트 리스너) 아래는 ul li리스트 중 하나를.. 2023. 3. 12. 이전 1 ··· 15 16 17 18 19 20 21 ··· 37 다음 728x90 반응형 LIST