如何從hrefs列表中獲取上一個和下一個鏈接hrefs？

Question

我有下面的代碼來檢查與ID =菜單 元素的內部鏈接的點擊事件：

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

，這個代碼的工作就看起來像這樣的HTML：

<ul id="menu"> 
    <li><a href="/City/0101004H">1</a></li> 
    <li><a href="/City/0101004I">2</a></li> 
    <li><a href="/City/0101004J">3</a></li> 
    <li><a href="/City/0101004K">4</a></li> 
</ul> 

我在我的屏幕的另一部分有兩個鏈接，如下所示：

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

我該怎麼做，以便如果用戶點擊「2」l墨那麼這些鏈接改爲：

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

Answer 1

你可以用你喜歡：

$("#menu").on('click', 'a[href^="/City"]', function (event) { 
    event.preventDefault(); 
    if(jQuery(this).text() == 2) { // this check is not required if this functionality is required for any 'a' under #menu 
     jQuery(this).closest('ul').find('li:first').find('a').css('color','yellow'); 
     jQuery(this).closest('ul').find('li:last').find('a').css('color','pink'); 
     $('#prev').prop('href', $(this).parent().prev().find('a').prop('href')).prop('title','City 1').css('color','red'); 
     $('#next').prop('href', $(this).parent().next().find('a').prop('href')).prop('title','City 3').css('color','green'); 
    } 
}); 

Fiddle

更新：

jQuery(this).parent().prev().find('a') // this will give prev a 

jQuery(this).parent().prev().find('a') // this will give next a 

2nd Fiddle