Question

我坚持一点，需要你的帮助朋友。我需要上一个和下一个列表。例如，我在ul中有三个li，第二个是活动的。现在我必须得到上一个和下一个li id。如果第一个李是活跃的，那么如果最后一个人没有做任何事情，也不要做任何事情。

<ul>
    <li id="1">First <span class="testId">14</span></li>
    <li id="2" class="active">Second <span class="testId">15</span></li>
    <li id="3">Third <span class="testId">16</span></li>
</ul>

Jquery代码我尝试但不明白该怎么做

if(){
            alert('good');
            /*var PrevTestId = $(this).prev('li').find('.testId').text();
            var thisId = $(this).next().find('.testId').text();
            alert(PrevTestId +" , "+ thisId);*/
        }
        if($(this).index() > 0){
            var PrevTestId = $(this).prev('li').find('.testId').text();
            var thisId = $(this).next().find('.testId').text();
            alert(PrevTestId +" , "+ thisId);   
        }

Answer 1

您可以使用解决方案https://jsfiddle.net/1aL33df4/

＆＃13;

$('li').hover(function(){
  	if( typeof $(this).prev().attr('id') != 'undefined')
  		console.log("Previous Element ID: " + $(this).prev().attr('id'));
    if( typeof $(this).next().attr('id') != 'undefined')
    	console.log("Next Element ID: " + $(this).next().attr('id'));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li id="1">First <span class="testId">14</span></li>
    <li id="2" class="active">Second <span class="testId">15</span></li>
    <li id="3">Third <span class="testId">16</span></li>
</ul>

＆＃13;

Answer 2

使用.next（）或.prev（）来获取相应的li
使用.attr（）获取id
使用hasClass（）来测试li是否具有活动类

＆＃13;

var pliid = $("ul li.active").prev('li').attr('id');
var nliid = $("ul li.active").next('li').attr('id');

console.log("prev li id is " + pliid)
console.log("prev li is active " +  $("ul li.active").prev('li').hasClass('active'))
console.log("prev li textid text " +  $("ul li.active").prev('li').find('.testId').text())
console.log("next li id is " + nliid)
console.log("next li is active " +  $("ul li.active").next('li').hasClass('active'))
console.log("next li textid text " +  $("ul li.active").next('li').find('.testId').text())

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li id="1">First <span class="testId">14</span></li>
    <li id="2" class="active">Second <span class="testId">15</span></li>
    <li id="3">Third <span class="testId">16</span></li>
</ul>

＆＃13;

如果有，请获取上一个和下一个列表项ID

2 个答案: