jQuery에서 ready 가 두번 호출 하는 경우.

일하면서 희안한 경우가 발생했다.

jQuery를 쓰고 있는데 이상하게 ready() 함수가 2번이 호출되는 것이다.

원인은 알아냈는데, 이게 왜 이런 현상이 나타나는지는 도저히 알수가 없다.

구글링을 해보면 해외에서도 꽤 많이 발생하는 현상으로 보이는데 왜 이런 현상이 나타나는지 설명이 안되어 있다.

내가 해석을 못했을 수도 있고.

일단 원인은, jQuery와 jQuery Mobile을 같이 include하여 사용했을 경우에 발생했다.

그리고 ready 함수가 <head> 태그 사이에 있으면 정상적으로 1번만 호출되지만 <head> 태그 바깥에서 호출하면 2번이 호출 된다.

왜 이런지 이유는 알 수 없다.

아무래도 jQuery Mobile에서 뭔가 한 번 더 작업을 해서 이런 현상이 발생한다는 정도만 알 수 있다.

이 문제를 해결하려면 여러가지 방법이 있다.

1. pageinit 함수를 jQuery Mobile를 include 하기 전에 선언한다.

2. <head> 사이에 ready 함수를 사용한다.

3. <head> 바깥에 사용할 경우에는 isloaded 변수를 정의해서 ready() 함수가 끝나는 부분에 true로 하고 강제적으로 1번만 호출될 수 있도록 한다.

3번의 예제 소스.

var isloaded = false;

$(function() {

if (isloaded) {

return;

}

// 로직이 들어간다.

isloaded = true;

});

어느 천년에...