0

要素の位置を div に保存するにはどうすればよいですか?

シリアル化を使用しますか? はいの場合、どうすればよいですか?

私はこのdivを持っています:

<div id="produtlist">
    <img id="productid_10" src="images/pic10.jpg" class="sortableproduct" alt="" title="" />
    <img id="productid_11" src="images/image1.jpg" class="sortableproduct" alt="" title="" />
    <img id="productid_12" src="images/image2.jpg" class="sortableproduct" alt="" title="" />
    <img id="productid_13" src="images/pic1.jpg" class="sortableproduct" alt="" title="" />
    <img id="productid_14" src="images/pic2.jpg" class="sortableproduct" alt="" title="" />
    <img id="productid_15" src="images/pic3.jpg" class="sortableproduct" alt="" title="" />
</div>
4

2 に答える 2

0

順序を覚えておく必要がある場合は、カンマで区切られたIDの文字列をCookieに入れることができますか？そして、ページの読み込み時にそれらを引き出します。

シリアル化は、私が知る限り、フォームデータでのみ機能し、DOM要素では機能しません。

コメントに対処するには、単純なjqueryを使用してページからCSVを作成します。

var list = '';
$('#productlist .sortableproduct').each(function() {
    list += this.attr('id') + ',';
});

次に、リストをCookieに保存するか、サーバーに送り返します。

物事を元に戻すのは少し難しいです。文字列をサーバーに送り返すと、正しい順序で出力する方がはるかに簡単になります...しかし、jqueryのDOMツールを使用してDOMオブジェクトを移動できます。どちらにしても十分に単純です。

于 2009-05-25T09:23:46.277 に答える
0

プロジェクトの 1 つで同様の関数を使用しており、順序を復元する準備ができているコードがあります。この関数は 2 つのパラメーターを取ります。

  1. リストコンテナ
  2. コンマ区切りの ID を保持する Cookie。

私はそれを使用してulベースのリストを並べ替えますが、あなたの場合もうまくいくはずです...

// Function that restores the list order from a cookie
function restoreOrder( _list, _cookie ) {

    var list = $( '#' + _list );
    if( list == null ) return;

    // fetch the cookie value (saved order)
    var cookie = $.cookie( _cookie );

    if( !cookie ) return;

    // make array from saved order
    var IDs = cookie.split( "," );

    // fetch current order
    var items = list.sortable( "toArray" );

    // make array from current order
    var rebuild = new Array();
    for( var v = 0, len = items.length; v < len; v++ )
        rebuild[items[v]] = items[v];

    for( var i = 0, n = IDs.length; i < n; i++ ) {

        // item id from saved order
        var itemID = IDs[i];

        if( itemID in rebuild ) {

            // select item id from current order
            var item = rebuild[itemID];

            // select the item according to current order
            var child = $( '#' + _list ).children( '#' + item );

            // select the item according to the saved order
            var savedOrd = $( '#' + _list ).children( '#' + itemID );

            // remove all the items
            child.remove();

            // add the items in turn according to saved order
            // we need to filter here since the "ui-sortable"
            // class is applied to all ul elements and we
            // only want the very first!  You can modify this
            // to support multiple lists - not tested!
            $( '#' + _list ).filter( ':first' ).append( savedOrd );

        } // if

    } // for

} // restoreOrder

どこから入手したか忘れてしまいました (グーグル中に出てきたフォーラムやブログ)... しかし、元の作者の功績によるものです。これらのパラメーターを受け入れることで、元のルーチンを少し変更して再利用しやすくしました。

乾杯、微視的^地球

于 2009-05-26T08:53:35.183 に答える