如何从hrefs列表中获取上一个和下一个链接hrefs？

Question

我有下面的代码来检查与ID =菜单 元素的内部链接的点击事件：

$("#menu") 
    .on('click', 'a[href^="/City"]', function (event) { 
     event.preventDefault(); 
     $('#editLink').attr("data-href", link); 
    }); 

，这个代码的工作就看起来像这样的HTML：

<ul class="controls-buttons question-grid" id="menu"> 
    <li class="question-grid"><a href="/City/0101004H">1</a></li> 
    <li class="question-grid"><a href="/City/0101004I">2</a></li> 
    <li class="question-grid"><a href="/City/0101004J">3</a></li> 
    <li class="question-grid"><a href="/City/0101004K">4</a></li> 
</ul> 

我在我的屏幕的另一部分有两个链接如下：

<a id="prev" href="#">Prev</a> 
<a id="next" href="#">Next</a> 

我该怎么做才能让用户点击“2 “链接，那么这些链接改为：

<a id="prev" href="/City/0101004H" title="City 1">Prev</a> 
<a id="next" href="/City/0101004J" title="City 3">Next</a> 

如果用户点击了‘1’的链接改为：

<a id="prev" href="#"></a> 
<a id="next" href="/City/0101004J" title="City 2">Next</a> 

如果在列表的最后一个元素用户点击那么链接将更改为：

<a id="prev" href="/City/0101004H" title="City 3">Prev</a> 
<a id="next" href="#"></a> 

对我来说，最大的问题是如何检查当前链接之前或之后是否存在链接。我知道基本的jQuery，但我希望有人能帮助我提出一些建议。

Answer 1

我猜是这样的：

$("#menu").on('click', 'a[href^="/City"]', function(e) { 
    e.preventDefault(); 
    $('#editLink').attr("data-href", $(this).attr('href')); 
}); 

$('#prev, #next').on('click', function() { 
    var isNext = this.id==='next', 
     liNow = $('#editLink').attr("data-href") || $('#menu li:first a').attr('href'), 
     nextA = $('a[href="'+liNow+'"]', '#menu').parent('li')[isNext?'next':'prev']('li').find('a'); 
    if (!nextA.length) nextA = isNext ? $('#menu li:last a') : $('#menu li:first a'); 
    nextA.trigger('click'); 
}); 

FIDDLE

Answer 2

我没有测试这一点，但希望对大家有用：

$('.question-grid a').click(function(){ 

    var number=parseInt($(this).html()); 

    if(number<2) 
    { 
     $('#prev').attr('href','#'); 
     $('#next').attr('href',$(this).next('a').attr('href'); 
    }else if(number>1 && number<4){ 
     $('#prev').attr('href',$(this).prev('a').attr('href')); 
     $('#next').attr('href',$(this).next('a').attr('href')); 
    }else{ 
     $('#prev').attr('href',$(this).prev('a').attr('href')); 
     $('#next').attr('href','#'); 
    } 
});