요즘 ajax를 게시물 형태의 게시판에서 많이 볼 수 있는데요.

이때 조심해야 할것이 있습니다. 

바로 live, delegate 인데요. 

게시물형태의 리스트에서 화면전환 없이 등록버튼이나, 페이지 처리시에 

새로운 글화면이나, 다음페이징 처리를 ajax로 호출해서 화면에 append()하는 경우가 종종 있습니다.

ajax를 호출하는 페이지, 호출당하는 페이지가 있다면...

주의하실게~

ajax 호출당하는 페이지안에 정의하는 <script>~</script>블럭안에는 

live나 delegate를 사용하지 않아야 한다는 겁니다.

호출하는 페이지의 글등록버튼을 통해 ajax로 호출당하는 페이지를 요청하여 

아래의 "layerNewReg" 라는 영역에 랜더링 했다고 합시다.

<input type=button value="글등록">

<div id="layerNewReg"></div>

이때 호출당하는 페이지안에 다음과 같으면 문제가 발생할 수 있습니다.

<script>

$(document).ready(function(){

    $('form').live('submit', function(){

        <!-- 결과처리 -->

    });

});

</script>

live나 delegate로 해당 이벤트를 등록시에 submit 이벤트가 누적됩니다. 고로 여러번의 submit이 일어나는 거죠.

(당연한 이야기. 버튼을 여러번 눌러보세요. trigger Event~ 누적)

페이징 처리나  레이어 팝업에서 해당 글의  신규글,글수정 처리시에 까딱했다가는 

의도하지 않은 중복이벤트처리로 DB가 피똥(!!)쌀 수 있습니다.

무심결에 손가는데로 하다가는 큰일납니다.

ajax페이지에서는 live나 delegate보다는 bind나 direct로 구현해야 하겠네요.~

아시는 분들은 스킵 ^^* 

-테스트환경

-xhtml1.0, 

-jquery.1.6.2.js

-Google Chrome 13.0.782.220