jquery - DOM jQuery 查找当前元素的下一个和上一个元素

Question

如何使用 jQuery 从“#current”中查找下一个和上一个“A”元素。HTML:

<ul>
    <li>
        <a></a>
        <a></a>
        <a></a>
    </li>
    <li>
        <a></a>
        <a></a>
        <a id='current'></a>
    </li>
    <li>
        <a></a>
        <a></a>
        <a></a>
    </li>
</ul>

我尝试创建一个类似这样的代码:

var curr = $('#current');
var prev = curr.parent().prev('a');
var next = curr.parent().next('a');

但是没有成功。我认为这是一个非常简单的问题，但我现在陷入困境。有什么想法吗？

UPD:如果“A”是当前“LI”中的最后一个“A”元素，它应该移动到下一个“LI”元素来查找“A”。

Answer 1

您不需要使用父级来获取上一个和下一个

<强> Live Demo

var curr = $('#current');
var prev = curr.prev('a');
var next = curr.next('a');

要制作此交叉行，您需要检查当前元素是否位于行的第一个或最后一个。如果当前元素是第一个，那么最后一个元素将是上一行的最后一个元素，类似地，如果当前元素是行的最后一个，那么下一个元素将是下一行的第一个元素。

<强> Live Demo

$('a').click(function () {
    $('ul > li > a').css('background-color', 'white');
    var curr = $(this);
    curr.css('background-color', 'green');;
    var prev = curr.prev('a')
    if(prev.length == 0 )
    {
        lastaOfPrevLi = curr.parent().prev();
        if( lastaOfPrevLi.length != 0)
            lastaOfPrevLi.find('a:last').css('background-color', 'red');
    }
    else
        prev.css('background-color', 'red');
    var next = curr.next('a');
    if(next.length == 0 )
    {
        lastaOfNextLi = curr.parent().next();
        if( lastaOfNextLi.length != 0)
            lastaOfNextLi.find('a:first').css('background-color', 'orange');
    }
    else
            next.css('background-color', 'orange');
});