2013-03-19 3 views
0

작업이 JQuery와 팝업 메뉴 스크립트를 수정해야 - 당신이 스크립트를 호출하는만큼.나는에서이 스크립트를 사용하고 아약스

팝업이 이미 설정된 경우 실행되지 않도록하는 방법을 알아 내려고하고 있습니다. 다음 스크립트는 다음과 같습니다

// 
// pop! for jQuery 
// v0.2 requires jQuery v1.2 or later 
// 
// Licensed under the MIT: 
// http://www.opensource.org/licenses/mit-license.php 
// 
// Copyright 2007,2008 SEAOFCLOUDS [http://seaofclouds.com] 
// 

(function($) { 

    $.pop = function(options){ 

    // inject html wrapper 
    function initpops(){ 
     $(".pop").each(function() { 
     var pop_classes = $(this).attr("class");   
     if ($(this).find('.pop_menu').length) {   
      // do nothing  
     } else { 
      $(this).addClass("pop_menu");  
      $(this).wrap("<div class='"+pop_classes+"'></div>"); 
      $(".pop_menu").attr("class", "pop_menu"); 
      $(this).before(" \ 
      <div class='pop_toggle'></div> \ 
      ");  
     }  

     }); 
    } 
    initpops(); 

    // assign reverse z-indexes to each pop 
    var totalpops = $(".pop").length + 100; 
    $(".pop").each(function(i) { 
    var popzindex = totalpops - i; 
    $(this).css({ zIndex: popzindex }); 
    }); 

    // close pops if user clicks outside of pop 
    activePop = null; 
    function closeInactivePop() { 
     $(".pop").each(function (i) { 
     if ($(this).hasClass('active') && i!=activePop) { 
      $(this).removeClass('active'); 
      } 
     }); 
     return false; 
    } 
    $(".pop").mouseover(function() { activePop = $(".pop").index(this); }); 
    $(".pop").mouseout(function() { activePop = null; }); 

    $("body").on("click", ".pop", function(){  
    closeInactivePop(); 
    }); 
    // toggle that pop 
    $("body").on("click", ".pop_toggle", function(){ 
     $(this).parent(".pop").toggleClass("active"); 
    }); 
    } 

})(jQuery); 

을 지금 내가 전화 새로운 팝 아웃 메뉴 작업을 아약스에서이 스크립트를로드하지만, 오래된 것들은 onclick 이벤트에 반응하지 않는 경우.

답변

0

플러그인을 사용해서는 안됩니다. 그것은 꼭해야 할 것과 똑같이 작동합니다. 이미 가지고 계신 요소에 대해 어떻게 호출하는지 알려주세요.

나는이 플러그인을 좋아하지 않습니다. JqueryUI 더 나은 방법으로 그런 일을 할 수 있습니다.

[편집] 첫 번째 코드 (플러그인)를 시도했는데 올바르게 작동합니다.

[편집] 확인. 알 겠어. 당신은 $ .pop()를 호출합니다; 여러 번. 넌 안된다! $ .pop() 호출; class = "pop"인 모든 요소에 드롭 다운 메뉴를 고정시킵니다. 이것은 당신이 그렇게 재미있는 스택을 가지고있는 이유입니다. 그냥 $ .pop(); 일단. 플러그인은 페이지에서 동적으로 생성 된 새로운 요소를 연결할 수있는 기능을 제공하지 않습니다.

+0

것은 내가 그 다른 새로운 요소를 활성화 팝 이벤트를 트리거 할 필요가 그래서 새로운 .pop 요소를 호출하는 아약스를 사용하고 있습니다. 나는 플러그인이 그것을 위해 설계되지 않았 음을 이해합니다. 그래서 코드를 적절하게 수정해야합니다. –

+0

수정하지 마십시오. 그럴 가치가 없어. 지정된 요소에 고정시킬 수있는 것을 훨씬 쉽게 작성할 수 있습니다. .pop_ready와 같은 클래스를 하나 더 추가 할 수도 있습니다. 클래스를 만들면 .pop 클래스가 .pop_ready로 변경됩니다. 그러면 다음 init 이후에 다시 렌더링되지 않습니다. 많은 작업이 아닙니다. :) – imclickingmaniac

0

제거 아약스 호출에서 팝 그냥 성공이라는 : ​​

   $(".pop").each(function() { 
       var pop_classes = $(this).attr("class");   
       if ($(this).find('.pop_menu').length) {   
       // do nothing  
       } else { 
       $(this).addClass("pop_menu");  
       $(this).wrap("<div class='"+pop_classes+"'></div>"); 
       $(".pop_menu").attr("class", "pop_menu"); 
       $(this).before(" \ 
       <div class='pop_toggle'></div> \ 
       ");  
       }        
       });  
       // assign reverse z-indexes to each pop 
       var totalpops = $(".pop").length + 100; 
       $(".pop").each(function(i) { 
       var popzindex = totalpops - i; 
       $(this).css({ zIndex: popzindex }); 
       });  
       // close pops if user clicks outside of pop 
       activePop = null; 
       function closeInactivePop() { 
        $(".pop").each(function (i) { 
        if ($(this).hasClass('active') && i!=activePop) { 
         $(this).removeClass('active'); 
         } 
        }); 
        return false; 
       } 
       $(".pop").mouseover(function() { activePop = $(".pop").index(this); }); 
       $(".pop").mouseout(function() { activePop = null; }); 
관련 문제