jquery - 更改先前 UL 的背景颜色

Question

以下 DIV 位于更新面板内:

<div style="overflow: hidden; float: left; width: 31%; padding: 1%;">
    <ul class="tabs">
        <li><a href="javascript:void(0);">STEP #2</a></li>
    </ul>
    <div class="content">
        <div style="display: block;">
            <h4>To update the profile for every provider once the SQL job has been executed</h4>
            <div style="overflow: hidden; clear: both; padding: 0 0 20px 0;">
                <button onclick="__doPostBack('ctl00$CPHB$btnUpdateAP','')" id="co_AP" type="button" class="btnAll btnUpdt">Update All Providers</button>
                <span id="lblUMsg"></span>
            </div>
        </div>
    </div>
</div>

我试图在将鼠标悬停在 .content div 上时更改 li 背景，但以下内容不起作用:

$('body').on("mouseenter", ".content", function (e) {
    $(this).prevAll("li").css("background", "#FF0000");
});
$('body').on("mouseleave", ".content", function (e) {
    $(this).closest("ul li").css("background", "#FF0000");
});

如何更改背景颜色。

Answer 1

您需要使用prev()

$('body').on("mouseenter", ".content", function (e) {
    $(this).prev().find('li').css("background", "#FF0000");
});

或者prevAll()采用以下格式

$('body').on("mouseleave", ".content", function (e) {
    $(this).prevAll("ul").first().find('li').css("background", "#FF0000");
});