2013-12-20 1 views
0

현재 jQuery 모바일 앱을 개발 중입니다. 한 페이지에는 차트를 만들어서 (하이 차트) 내보낼 수 있습니다 (canvg 및 canvas2ImagePlugin). 그러나 차트 개체가 메모리에 남아있는 것으로 나타났습니다. 이것은 페이지가 여러 번 열리고 내보내기 단추가 눌려지면 이전에 생성 된 모든 그래프가 내보내집니다.

Chrome Dev Tool의 힙 스냅 샷을 살펴보면 모든 개체가 메모리에 남아있는 것으로 나타났습니다. 이를 증명하기 위해 jsfiddle에 대한 기본 앱을 만들었습니다. 모든 하이 차트와 canvg 코드를 남겨 두었습니다 : http://jsfiddle.net/dreischer/Lt4Xw/ -> 버튼을 클릭하여 두 번째 페이지로 이동하십시오. 내보내기 버튼을 클릭하면 팝업 창이 열립니다. 그러나 페이지 1로 돌아가서 페이지 2로 돌아가서 버튼을 다시 클릭하면 두 개의 팝업이 열립니다 (팝업을 허용해야 할 수도 있음).jQuery 모바일 객체가 메모리에 저장됩니다.

또한 analyseGraph를 null 또는 undefined로 설정하거나 pagebeforehide에서 .remove()를 사용하여 시도했지만 도움이되지 않았습니다.

도움 주셔서 감사합니다. 여기

이 예를 들어, 코드 :
는 HTML :

<div data-role="page" id="p1"> 
     <div data-role="header"><h1>Header Page 1</h1></div> 
     <div data-role="content"> 
      <p>Page 1</p> 
      <a href="#p2" data-role="button">Go To Page 2</a> 
     </div> 
    </div> 

    <div data-role="page" id="p2"> 
     <div data-role="header" data-rel="back"><h1>Header Page 2</h1></div> 
     <div data-role="content"> 
      <p>Page 2</p> 
      <a href="#p1" data-role="button">Go To Page 1</a> 
      <a id="export_graph" data-role="button" style="max-width: 300px;" data-mini="true">Export</a> 
     </div>  
    </div> 

자바 스크립트 :

$(document).on('pagebeforeshow', '#p2', function(){ 

    var Graph = function(){ 
     this.drawGraph = function(){}; 
     this.exportCanvas = function(){ 
      window.open(); 
     };   
    } 

    var analyseGraph = new Graph(); 
    analyseGraph.drawGraph(); 
    $(document).on('click', '#export_graph', function(){ 
     analyseGraph.exportCanvas(); 
    }); 

}); 

답변

0

당신이 2 페이지를 보여줄 때마다 당신이 문서에 클릭 이벤트를 바인딩 . 따라서 잠시 후 '꺼짐'을 사용해야한다고 생각합니다. this

$(document).on('click', '#export_graph', function(){ 
    analyseGraph.exportCanvas(); 
    $(document).off('click'); 
}); 
관련 문제