Question

I have the following code that checks for click events on links inside of the element with 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” 的“ 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 , # ); 
   }
});

友情链接