Question

我有以下代码检查内部链接上的点击事件 id = menu的元素：

$("#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','#'); 
   }
});

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

2 个答案: