사용자가 직접 클릭하지 않고 자동으로 클릭이 되는 기능을 동작시키고 싶을 때가 있다.
왼쪽 메뉴를 클릭하거나 로그인 버튼을 눌렀을 때 팝업 모달이 자동으로 실행되게 하고 싶은데 처음에는 좀 해맸다.
로직에 대한 기본 이해 부족이었다.
동작 순서를 고려하여 순차적으로 실행되게 해야 한다.
1. 왼쪽 메뉴를 누르면
2. a href 링크의 고유 기능은 이벤트 실행 금지 시킨다. e.preventDefault();
3. 우측 content 에 원하는 걸 load 시킨다.
$('.memberModify').on('click',function(e){
var uri = $(this).attr('href');
if(uri != '#'){
$('#panel_content').load(uri);
}
});
4. load 되는 곳에 특정 키워드가 포함되어 있고 또 클릭을 해야 하는 불편이 있다면...
$('.memberModify').on('click',function(e){
e.preventDefault(); // a 링크 실행 방지
var uri = $(this).attr('href');
if(uri != '#'){
$('#panel_content').load(uri,function(){
if($('#modalLoginClick:contains("눌러주세요")')){
$('#modalLoginClick').trigger('click'); // 자동 클릭
}
});
}
});
trigger 메소드를 사용하면 자동 클릭이 되는 걸 확인할 수 있다.
load 시킨 다음에 자동 클릭이 되어야 정확하게 원하는 결과가 나왔다.
ㅇ trigger(eventType)
eventType는 이벤트의 타입을 지정하는 문자열로써 click, dblclick, focus, blur 등등 해당 이벤트를 구동한다.
'Web 프로그램 > js, jQuery' 카테고리의 다른 글
| [Javascript] 맥북 node.js install (0) | 2021.06.11 |
|---|---|
| jQuery 테이블 처리 다루기 ★★ (0) | 2020.11.06 |
| 검색어 입력후 엔터키 누르면 실행되는 코드 (0) | 2019.01.29 |
| jQuery 입력값 체크 함수 만들어 사용하기 (0) | 2019.01.26 |
| jQuery UI 팝업창 위치 정중앙으로 (0) | 2019.01.21 |
Link2Me