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>

如果单击 Cat 1-2，所需的结果将是： str = "Cat 1/Cat 1-1/Cat 1-2";

如果单击 Cat 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

我不知道这是否比 Brad 的方法更有效，但我很早就开始研究这个，它一直困扰着我，直到我完成为止。

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 回答