dynamiclly div에 대한 Jqueryui 슬라이더

페이징으로 데이터 세트에 대한 슬라이더가 있습니다. 문제는 슬라이더가 포함 된 div가 ajax 요청에서 ajax를 통해로드된다는 것입니다. 그래서 그것은 작동하지 않습니다.dynamiclly div에 대한 Jqueryui 슬라이더

페이징 기능 :

function loadData(page){ 
        loading_show(); 
        confID = $("#confID").val(); 
        verID = $("#confID").attr("v"); 
        $.ajax 
        ({ 
         type: "POST", 
         url: "paging-offlineTemp.php", 
         data: {page:page, confID: confID, verID:verID}, 
         success: function(msg) 
         { 
           loading_hide(); 
           $("#container").html(msg); 
           resize_iframe(); 
           $(".slider").each(function(){ 
            $(this).slider({ animate: true, 
             value: parseInt($(this).attr("preRate")), 
             min: 0, 
             max: 5, 
             step: 1 
            }); 
            if($(this).attr("preRate") == -1) { 
             $(this).slider({ disabled: true }); 
             td = $(this).parent("td"); 
             tr = $(td).parent("tr"); 
             box= $(tr).find(":checkbox"); 
             $(box).attr("checked",true); 

            } 
           }); 
         } 
        }); 
       }

pageing-offlineTemp.php 너무 길지만 단지 제한하여 슬라이더 제어

기능 데이터의 다음 세트를 선택

$(".slider").each(function(){ 
        $(this).slider({ animate: true, 
         value: parseInt($(this).attr("preRate")), 
         min: 0, 
         max: 5, 
         step: 1, 
         change: function(event, ui) { 
          $(this).attr("rate", ui.value); 
          rate = $(this).attr("rate"); 
          confID = $(this).attr("confID"); 
          critID = $(this).attr("criteria"); 
          paperID = $(this).attr("paperID"); 
          label = $(this).parent("td").find("label"); 
          $(label).html("New rate: "+ rate); 
          td = $(this).parent("td"); 
          tr = $(td).parent("tr"); 
          span = $(tr).find("span"); 
          $(span).fadeIn("slow"); 
          $.ajax ({ 
           data:{rate:rate, confID:confID, critID:critID, paperID:paperID}, 
           type: 'POST', 
           url: 'update_rate.php', 
           success: function(response) { 
            //alert(response) 
            $(span).delay(500).fadeOut('slow'); 
           } 
          }); 
         } 
        });

슬라이더 div :

<div type="" paperID="'. $paper .'" preRate="'. intval($irate) .'" 
           criteria="'.$row['rate_id'].'" confID="'.$conf_id.'" rate="" class="slider"> 
        </div>

처음에는 페이징 컨테이너 div가 비어 있고 클래스 슬라이더가없는 요소이므로 슬라이더 기능이 작동하지 않는다고 생각합니다. 슬라이더 이벤트가 실행되는 동안 페이징을 유지할 수있는 방법이 있습니까? 아약스 호출 동기를 만들기

는

출처

2012-09-11 Samer El Gendy

짧은 대답의 성공 콜백으로 이동 : '$ ('슬라이더')를 움직이십시오. ('ajax 함수'의'success' 콜백으로) – Ohgodwhy

고마워, 답변에 의견을 추가하여 문제 해결을 위해 표시해주십시오. –