0

ユーザーが Cat 1-2 のような li 要素をクリックして、親 li のすべてのテキストを文字列または配列に返すシナリオがある場合、順序付きリストをトラバースしてテキストを返すにはどうすればよいですか。配列の場合、並べ替えを逆にすることができますが、最終的には文字列にする必要があります。

例：

<ul>
    <li>Cat 1
        <ul>
            <li>Cat 1-1
                <ul>
                    <li>Cat 1-2</li>
                </ul>
            </li>
         </ul>
    </li>
    <li>Cat 2
        <ul>
            <li>Cat 2-1
                <ul>
                    <li>Cat 2-2</li>
                </ul>
            </li>
         </ul>
    </li>
</ul>

カテゴリ 1-2 をクリックすると、望ましい結果は次のようになります。 str = "カテゴリ 1/カテゴリ 1-1/カテゴリ 1-2";

カテゴリ 2-1 をクリックすると、望ましい結果は次のようになります。 str = "Cat 2/Cat 2-1";

私が欲しいのは、すべての選択を次のような文字列階層に結合できるチェックボックスです。 str = "Cat 1/Cat 1-1/Cat 1-2|Cat 2/Cat 2-1";

4

2 に答える 2

3

ここ; 次に、より良い方法を見つけることができます (おそらく textContent を使用します)...

$('li').click(function(e){
    var parents = $(this).add($(this).parents('li'))
        .map(function(){
            return $(this).clone().children().remove().end()
                   .text().replace(/\r|\n|^\s+|\s+$/g,'');
        })
        .toArray().join('/');
    alert(parents);
    e.stopPropagation();
});
于 2013-06-07T20:16:16.763 に答える
1

これがブラッドの方法よりも効率的かどうかはわかりませんが、私は以前にこれに取り組み始めたので、完了するまで悩まされました。

jsFiddle の例

var ary = [];
$('li').click(function (e) {
    ary.push($.trim($(this).clone()
        .children()
        .remove()
        .end()
        .text()));
    if ($(this).parents('ul').parent('li').length == 0) {
        console.log(ary.reverse().join('/'));
        ary = [];
    }
});
于 2013-06-07T21:07:25.290 に答える