[Event] JQ - live() 메서드 - JQ 1.9 폐기완료. on() 메서드로 대체. / 여러 이벤트 부착. (= live메서드 = 라이브 메서드)

목차

1. live() 예제 - 현재 요소에 이벤트 부착
2. live() 정의
3. live() 구문
4. live() 예제 - (현재 + 미래) 요소에 이벤트 부착

live() 예제 - 현재 요소에 이벤트 부착

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">

</script>

<script>

$(document).ready(function(){

  $("button").live("click", function(){

    $("p").slideToggle();

  });

});

</script>

<p>홈짱닷컴 Homzzang.com</p>

<button>클릭</button>

 

결과보기

live() 정의

 

지정 요소에 대해 하나 이상의 이벤트 핸들러 지정 및 이벤트 발생 시 실행할 함수를 지정.

 

---

 

1.

jQuery 1.7 - 폐기예고.

jQeury 1.9 - 폐기완료. on() 메서드로 대체됨.

 

2.

live() 메서드로 부착한 이벤트 핸들러에 의해 영향 받는 요소.

① 현재 선택된 요소.

② 미래 생기는 요소.

 

3. 

die() 메서드 : 이벤트 핸들러 제거. (JQ 1.7 폐기예고. JQ 1.9 폐기완료.)

off() 메서드 : 이벤트 핸들러 제거. die() 메서드를 대체함.

 

live() 구문

 

$(selector).live(event,data,function)

 

---

[매개변수]

 

event

필수. 요소에 부착할 하나 이상의 이벤트 지정.

 

data

선택. 함수에 전달할 추가적인 정보.

 

function

필수. 이벤트 발생 시 실행할 함수 지정.

 

live() 예제 - (현재 + 미래) 요소에 이벤트 부착

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">

</script>

<script>

$(document).ready(function(){

  $("p").live("click", function(){

    $(this).slideToggle();

  });

  $("button").click(function(){

    $("<p>홈짱닷컴 Homzzang.com</p>").insertAfter("button");

  });

});

</script>

 

<p>홈짱닷컴 Homzzang.com.</p>

<button>P요소생성 (클릭)</button>

결과보기