jQuery:选择所选LI元素的所有父元素

Question

我有一个分级的UL列表.如何 - 使用jQuery - 获取所选LI元素的所有父元素并更改<a>每个父元素内的背景颜色？

<ul id="nav">
    <li>
        <a href="#">A</a>
        <ul>
            <li>
                <a href="#">B</a>
                <ul>
                    <li><a href="#">B1</a></li>
                    <li><a href="#">B2</a></li>
                    <li><a href="#">B3</a></li>

                    <li><a href="#">B4</a></li>
                    <li><a href="#">B5</a></li>
                </ul>
            </li>
            <li>
                <a href="#">C</a>
                <ul>
                    <li><a href="#">C1</a></li>
                    <li><a href="#">C2</a></li>
                    <li><a href="#">C3</a></li>
                </ul>
            </li>
        </ul>

如果我选择<a href="#">B4</a>,<a href="#">B</a>也<a href="#">A</a>将被选中

Answer 1

以下内容将click事件绑定到所有<li>元素,并将背景颜色直接应用于所有父项及其自身.

$('li').click(function() {
    $(this).parents().andSelf().css('background-color', 'red');
});

jQuery文档:

• parents
• andSelf