JQUERY(제이쿼리)

[JQUERY] 직접 클릭 없이 자동으로 클릭 이벤트 발생시키기

남익 2017. 3. 15. 08:30
반응형

사용자의 클릭 없이 자동으로 클릭 이벤트를 발생하기

사용자의 클릭 없이 자동으로 클릭 이벤트를 발생 시킬 수 있다.

1. 샘플예제


Bold button Italic button


결과화면


2. 소스코드

<%----javascript start-----------------------------------------------------%>

<script type="text/javascript">


$(document).ready(function(){

$(".buttons").bind("click", function(){

alert("click " + $(this).text());

});

// $(".buttons").click( function(){

// alert("click " + $(this).text());

// });

$(".buttons").bind("dblclick", function(){

alert("double-click " + $(this).text());

});

// $(".buttons").dblclick( function(){

// alert("double-click " + $(this).text());

// });

$("#Italic").trigger("click");

});

</script>

<%----javascript end-----------------------------------------------------%>

<%----HTML start---------------------------------------------------------%>

<span class = "buttons">Bold button</span>

<span class = "buttons" id="Italic" >Italic button</span>

<%----HTML end-----------------------------------------------------------%>

3. 설명

1) click(dblclick) 이벤트를 설정한다.

2) 설정이 완료 된 후 trigger 함수를 사용하여 클릭 이벤트를 실행한다.


JQUERY 참조 : http://api.jquery.com/trigger/

                 http://api.jquery.com/bind/

                  http://api.jquery.com/click/

                     http://api.jquery.com/dblclick/


- bind(eventType, data, handler)

  : eventType는 이벤트의 타입을 지정하는 문자열로써 click, dblclick, focus, blur등등

  : data는 이벤트 핸들러에 전달할 데이터로써 생략하면 데이터 대신 이벤트 핸들러 함수가 된다.

  : handler는 이벤트가 발생하면 수행할 문장들을 가진 함수

  

- click(handler)

  : handler는 이벤트가 발생하면 수행할 문장들을 가진 함수

  

- dblclick(handler)

  : handler는 이벤트가 발생하면 수행할 문장들을 가진 함수


- trigger(eventType)

  : eventType는 이벤트의 타입을 지정하는 문자열로써 click, dblclick, focus, blur등등

  : 해당 이벤트를 구동합니다.


반응형