Webpart 작성시 jQuery 로딩 확인 코드

요즘 Jquery 의 매력에 푹빠져서 잘 이용하고 있다.

정말 편리하게 잘 만들어진 라이브러리임에 틀림업다.

 

웹파트 만들면서  Jquery  참조해서 쓰다보니 한페이지안에 JQuery가 두번 세번 호출되어져서 사용하게 되는 문제가 발생하여 솔루션화 하기에도 어렵고 또한   function  을 확장하는데 아래위로 코드가 잡아 먹히는 문제가 발생해서 Undefined 오류가 발생한다.

 

Jquery 가 로딩되어 있는지 확인하고 없으면 Head 영역에 Jquery를 넣어주도록 수정해야한다.

 

중복을 피하는 방법은 여러가지가 있긴 하지만 아래의 방법이 가장 유용한것 같다.

 

http://social.msdn.microsoft.com/forums/en-US/sharepointgeneralprevious/thread/e98713ce-dc43-484d-b227-2bffdfca71ca

 

 

해당 코드만 삽입하면끝....

 

 

// Only do anything if jQuery isn't defined
if (typeof jQuery == 'undefined') {
if (typeof $ == 'function') {
  // warning, global var
  thisPageUsingOtherJSLibrary = true;
}

  function getScript(url, success) {
    var script     = document.createElement('script');
       script.src = url;

    var head = document.getElementsByTagName('head')[0],
    done = false;

    // Attach handlers for all browsers
    script.onload = script.onreadystatechange = function() {
     if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
      done = true;
        // callback function provided as param
    success();

        script.onload = script.onreadystatechange = null;
    head.removeChild(script);
       };
    };
    head.appendChild(script);
  };

  getScript('/_layouts/Themes/Common/jquery-1.7.2.min.js', function() {
   if (typeof jQuery=='undefined') {
     // Super failsafe - still somehow failed...
    } else {
     // jQuery loaded! Make sure to use .noConflict just in case
   fancyCode();
      if (thisPageUsingOtherJSLibrary) {
    // Run your jQuery Code
   } else {
    // Use .noConflict(), then run your jQuery Code
   }
    }
  });
} else { // jQuery was already loaded
  // Run your jQuery Code