AJAX 호출 후 jScrollPane이 사라짐

Ajax 호출을 통해 컨테이너에 데이터를로드 할 때 jScrollPane이 표시되지만 두 번째 호출을 시도 할 때 데이터가 사라지는 문제가 발생합니다 (데이터를 클릭하여 컨테이너에로드 함). 지도의 다른 부분). jScrollPane을 재 초기화하려고했지만 행운이 없었습니다. 문제가 무엇인지에 대한 아이디어가 있습니까? 아래는 소스 코드이며 주석 처리 된 섹션이 표시됩니다. 주석 처리 된 섹션과 jScrollPane의 API 참조는 같은 방식으로 기능하는 것처럼 보이지만 둘 다 스크롤 막대를 다시 초기화 할 수 없습니다. 당신이 jScrollPane 포함하는 요소의 html를 업데이트하기 때문에AJAX 호출 후 jScrollPane이 사라짐

function getMapData(){ 
    joinedStatesSelected = mapSelectedArrayForQuery.join(); 
    var url = 'loc='+joinedStatesSelected+''; 
     alert(url); 
    ajaxMapRequest = $.ajax({ 
     type: "GET", 
     url: "../../availabilities/maps?"+url, 
     datatype: "html", 
     success: function(x){ 
      $('#temporaryMapDirection').remove(); 
      $('.map-right-container').html(x); 

      /* 
      $('.map-right-container').jScrollPane({ 
       autoReinitialise:true, 
       autoReinitialiseDelay:100, 
       maintainPosition: false, 
       hideFocus: true 
       }); 
      */ 

      var mapContent = $('.map-right-container').jScrollPane(); 
      var api = mapContent.data('jsp'); 

      api.reinitialise(); 


      mapPropertyCount(); 

     }, 
     error: function() { 
      console.log('failed'); 
     } 
    }); 
}

출처

2013-12-16 user2989731

문제가 발생합니다. 따라서 스크롤 패널이 포함 된 요소의 내용 만 업데이트 한 다음 reinitialise을 호출해야합니다. 당신이 뭔가를 작성해야 귀하의 경우에는

http://jsfiddle.net/3yDX9/

그러나 정말이 다음이 요구된다 예에서 수행되는 한, HTML을 설정해야하는 경우

$('.map-right-container div.content').html(x);

destroyjScrollPane 전에 html 콘텐츠를 설정 한 다음 다시 만드십시오. 이 같은 것입니다 귀하의 경우에는

http://jsfiddle.net/Jx5eJ/

.... 

var pane = $('.map-right-container') 
    var api = pane.data('jsp'); 
    api.destroy(); 

$('.map-right-container').html(x); 

/* 
$('.map-right-container').jScrollPane({ 
    autoReinitialise:true, 
    autoReinitialiseDelay:100, 
    maintainPosition: false, 
    hideFocus: true 
}); 
*/ 

/*var mapContent = $('.map-right-container').jScrollPane(); 
var api = mapContent.data('jsp'); 

api.reinitialise();*/ 

$('.map-right-container').jScrollPane(); 

mapPropertyCount(); 
....

출처

2013-12-16 16:42:45 melc

흠이 솔루션은 위의 (심지어 첫 번째 아약스 호출 후) 완전히 사라져가 JScrollPane됩니다. 또한 html 내용이 푸시되고 jScrollPane이 호출되는 컨테이너를 분리해도 아무 것도하지 않는 것 같습니다 – user2989731

@ user2989731 제 생각에는 최선의 방법은 reinitialise를 사용하여 처음 언급 한 것입니다. 이상하게 작동하지 않는 경우, 별도의 컨테이너를 호출하여 HTML 컨텐트를 설정해야합니다. jScrollPane은 처음에 만들어야하고 나중에 map-right-container 요소에 다시 초기화해야합니다. – melc

그것을 알아 냈어! jscrollpane이 포함 된 요소에서 html을 업데이트하는 것과 관련이 있습니다. 고맙습니다! – user2989731

AJAX 호출 후 jScrollPane이 사라짐

답변

관련 문제