5

ネストされたLIアイテムを含む並べ替え可能なリストがあります。グループ内のIDfor eachの作成を探しています。LI

例。私がこれを持っている場合：

<li class="main"> Cat 0
    <ul class="subCat">
        <li>Subcat 0
            <ul class="subCat">
                <li>Sub-Subcat 0
                    <ul class="subCat"></ul>
                </li>
            </ul>
        </li>
        <li>Subcat 1</li>
    </ul>
</li>

わかりました、それらul.subCatは他のliアイテムをネストするためにあります。要素とその子要素にIDs を追加する関数を作成したいと考えています。この関数は、注文変更ごとに呼び出されます。lili

結果は次のようになります。

<li class="main" id="cat_0"> Cat 0
    <ul class="subCat">
        <li id="cat_0_0">Subcat 0
            <ul class="subCat">
                <li id="cat_0_0_0">Sub-Subcat 0
                    <ul class="subCat"></ul>
                </li>
            </ul>
        </li>
        <li id="cat_0_1">Subcat 1</li>
    </ul>
</li>

そして、要素ごとli.mainにストーリーを繰り返し、4 つのレベル (0 ～ 3) に到達します。

私の実際のコードは次のとおりです。

// level 0
target = $('#ulMenu >li');
for( i=0; i<=target.length-1; i++ ){
    target.eq(i).attr('id', 'cat_' + i).addClass('main');
}

// level 1
//------------------------------------------------------------------
$('#ulMenu >li.main').each(function(){

    target = $(this).children('ul').children('li');
    for( i=0; i<=target.length-1; i++ ){
        father = target.eq(i).parent('ul').parent('li').attr('id').split('_')[1];
        target.eq(i).attr('id', 'cat_' + padre + '_' + i);
    }

ID残りの要素に s を追加する方法を知る必要があります。私は試していましたが、解決策が見つかりません。

4

2 に答える 2

1

これは、任意の深さで機能する再帰的なソリューションです。

function menuID(el, base) {
    base = base || 'cat';
    $(el).filter('li').each(function(i) {
        this.id = base + '_' + i;
        menuID($(this).children('ul').children('li'), this.id);
    });
};

menuID('.main');​

http://jsfiddle.net/alnitak/XhnYa/を参照してください

別の方法として、jQuery プラグインとしてのバージョンを次に示します。

(function($) {
    $.fn.menuID = function(base) {
        base = base || 'cat';
        this.filter('li').each(function(i) {
            this.id = base + '_' + i;
            $(this).children('ul').children('li').menuID(this.id);
        });
    };
})(jQuery);

$('.main').menuID();

http://jsfiddle.net/alnitak/5hkQU/を参照してください

于 2012-10-04T12:50:05.417 に答える
1

このような何かがそれを行う必要があります...

$('#ulMenu').children('li').each(function(cat) {

    $(this).attr('id', 'cat_' + cat).children('ul').children('li').each(function(sCat) {

        $(this).attr('id', 'cat_' + cat + '_' + sCat).children('ul').children('li').each(function(ssCat) {

            $(this).attr('id', 'cat_' + cat + '_' + sCat + '_' + ssCat);
        });
    });
});​

例: http://jsfiddle.net/6YR5p/2/

于 2012-10-04T12:32:34.127 に答える