2016-06-22 4 views
0

이 코드를 사용하여 정렬 된 div의 위치를 ​​jquery-ui와 함께 저장합니다.jQuery UI Sortable -로드 위치

코드가 잘 작동하지만 내 질문은 ... 어떻게 한 번 저장된 위치에 다시로드 할 수 있습니까?

여기이 위치에 저장할 사용하고 코드는 다음과 같습니다

<div id="sortable"> 
    <div id="2000"></div> 
    <div id="1000"></div> 
    <div id="3000"></div> 
</div> 

$('#sortable').sortable({ 
    update: function() { save_new_order() } 
}); 

function save_new_order() { 
    var a = []; 
    $('#sortable').children().each(function (i) { 
     a.push($(this).attr('id') + ':' + i); 
    }); 
    var s = a.join(','); 
    alert(s); 
    localStorage.setItem("positions", s); 
} 

어떻게로드 할 수 있습니다?

+0

당신이 부하를 말할 때, 당신은 상쾌한 브라우저를 의미 모든 div의 이전에 저장 한 위치에 있습니까? – kasperite

답변

1

다음과 같이 값을 검색하고 순서를 업데이트 할 수 있습니다. 나는 순서를 검색하기 위해이 toArray 방법 내장 사용하고 있습니다 :

$(function() { 
    var $sortable = $('#sortable'); 
    var positions = JSON.parse(localStorage.getItem('positions')); 
    if (positions) { 
    $.each(positions, function(i, position) { 
     var $target = $sortable.find('#' + position); 
     $target.appendTo($sortable); // or prependTo for reverse 
    }); 
    } 

    $sortable.sortable({ 
    update: saveNewOrder 
    }); 

    function saveNewOrder() { 
    var positions = JSON.stringify($sortable.sortable("toArray")); 
    localStorage.setItem('positions', positions); 
    } 
}); 

JSFiddle demo