Javascript 如何正确到达数组的开头或结尾？如何传入当前选定项目的引用？

谢谢你花时间帮忙。CoffeeScript版本为1.3.3；jQuery版本来自Rails 3.2.8 jQuery Rails gem 2.1.3

我有一组诗，它们各自的链接存储在$poems\u中，用于\u year\u hrefs。我可以使用$.each（）并存储在poemUrls中获取$poems\u for\u year\u hrefs中元素的索引

单击页面的下一个链接时，用于将poemUrls的索引增加到下一个元素，并更新$next_链接的href属性。如果索引超过了Poemurl的长度，则索引将设置回0，以给出数组中的第一个元素

单击页面的上一个链接时，通过将Poemur中的当前索引减1，可获得$poems\u for\u year\u hrefs中的下一个元素。然后更新$prev_链接的href属性。如果当前索引小于或等于0，它将转到poemUrls数组中的最后一个元素

以下是CoffeeScript代码：

$(document).ready ->
    $poem_years = $('#poems-for-year ul li a')
    $poem = $('#main-poem').hide()
    $poem_years.click -> 
      $poem.eq(0).fadeIn('slow', -> 
        $poem.slideDown('slow')
     )
     console.log "Clicked on a poem title with index of #{$poem_years.index(@)}"

    $poems_for_year_hrefs = $('#poems-for-year ul li a[href]')

    index = $poems_for_year_hrefs.index(@)
    poemUrls = []
    $($poems_for_year_hrefs).each((i)->
      poemUrls[i] = $(@).attr('href')
      poemUrls.join(",")
    )
    console.log "The poemUrls array contains: #{poemUrls}"

    $next_link = $('#previous-next li a').last()
    $next_link.click ->
      if index >= poemUrls.length
        index = 0
        $next_link.attr('href', poemUrls[index]).attr('href')
      else
        index += 1
        console.log "$next_link was clicked on!"
        $next_link.attr('href', poemUrls[index]).attr('href')
        console.log "$next_link href was set to #{$next_link.attr('href')}"

    $prev_link = $('#previous-next li a').first()
    $prev_link.click ->
      if index <= 0
        index = poemUrls.length
        $prev_link.attr('href', poemUrls[index]).attr('href')
      else
        index -= 1
        console.log "$prev_link was clicked on!"
        $prev_link.attr('href', poemUrls[index]).attr('href')
      console.log "$prev_link href was set to #{$prev_link.attr('href')}"

$（文档）.ready->
$poem_years=$（“#ul li a年的诗歌”）
$poem=$（“#主诗”）.hide（）
$poem\u years.单击->
$poem.eq（0）.fadeIn（'slow'，->
$poem.slideDown（'slow'）
)
console.log“单击索引为#{$poem_years.index（@）}的诗歌标题”
$poems_for_year_hrefs=$（“#ul li a年诗歌[href]”）
索引=$poems\u年\u hrefs.index（@）
poemUrls=[]
$（$首诗，一年一次），每首（（i）->
poemUrls[i]=$（@）.attr（'href'）
poemUrls.join（“，”）
)
console.log“poemUrls数组包含：#{poemUrls}”
$next_link=$（“#上一个下一个li a”）.last（）
$next_link.单击->
如果索引>=poemUrls.length
索引=0
$next_link.attr（'href'，poemUrls[index]）.attr（'href'）
其他的
指数+=1
console.log“$next_链接已单击！”
$next_link.attr（'href'，poemUrls[index]）.attr（'href'）
console.log“$next_link href被设置为#{$next_link.attr（'href'）}”
$prev_link=$（“#上一个下一个li a”）.first（）
$prev_link.单击->
如果索引则有一个。错误在

if index >= poemUrls.length
    index = 0
...
if index <= 0
    index = poemUrls.length

编辑

    $next_link = $('#previous-next li a').last()
    $next_link.click ->
      nextPoemUrl = poemUrls[ if index >= poemUrls.length - 1 then 0 else index + 1 ]
      console.log "When I call $next_link_click, nextPoemUrl is: #{nextPoemUrl}"
      $next_link.attr('href', nextPoemUrl).attr('href')
      console.log "When I call $next_link_click, next_link href is: #{$next_link.href}"

    $prev_link = $('#previous-next li a').first()
    $prev_link.click ->
      prevPoemUrl = poemUrls[ if index <= poemUrls.length - 1 then 0 else index - 1 ]
      console.log "When I call $prev_link.click, prevPoemUrl is #{prevPoemUrl}"
      $prev_link.attr('href', prevPoemUrl).attr('href')
      console.log "When I call $prev_link_click, prev_link href is #{$prev_link.href}"

解决第二个问题，如果您想访问当前诗歌的同级，可以使用数组和索引结构。快速咖啡脚本解决方案是

prevPoemUrl = poemUrls[ if index <= 0 then poemUrls.length - 1 else index - 1 ]
nextPoemUrl = poemUrls[ if index >= poemUrls.length - 1 then 0 else index + 1 ]

prevPoemUrl=poemUrls[如果index=poemUrls.length-1，则0其他索引+1]
以下是获取单击诗歌的当前位置的源代码，并相应地进行下一个和上一个链接。这是一个粗略的草案，但有效：

$(document).ready ->
    $poem_years = $('#poems-for-year ul li a')
    $poem = $('#main-poem').hide()
    $poem_years.click -> 
      $poem.eq(0).fadeIn('slow', -> 
        $poem.slideDown('slow')
      )
      console.log "Clicked on a poem title with index of #{$poem_years.index(@)}" # <-- where gets current index of clicked poem title!
      $poems_for_year_hrefs = $('#poems-for-year ul li a[href]')
      index = $poem_years.index(@) # <-- Assign the current reference to the index variable
      poemUrls = []
      $($poems_for_year_hrefs).each((i)->
        poemUrls[i] = $(@).attr('href')
        poemUrls.join(",")
      )

      console.log "The poemUrls array contains these: #{poemUrls}"

      $prev_link = $('#previous-next li a').first()
      $prev_link.click ->
       console.log "the prevPoemUrl is: #{poemUrls[index]}"
       if index <= 0
         index = poemUrls.length - 1
         $prev_link.attr('href', poemUrls[index]).attr('href')
         $('#main-poem').hide().fadeIn('slow')
         console.log "$prev_link href when <= poemUrls.length was set to #{$prev_link.attr('href')}"
         console.log "The poemUrls when <= poemUrls.length is: #{poemUrls[index]}"
       else
         index -= 1
         console.log "$prev_link was clicked on!"
         $prev_link.attr('href', poemUrls[index]).attr('href')
         $('#main-poem').hide().fadeIn('slow')
         console.log "$prev_link href was set to #{$prev_link.attr('href')}"   
         console.log "The poemUrls poemUrls.length is: #{poemUrls[index]}"

      $next_link = $('#previous-next li a').last()
      $next_link.click ->
        if index >= poemUrls.length - 1
          index = 0
          $next_link.attr('href', poemUrls[index]).attr('href')
          $('#main-poem').hide().fadeIn('slow')
          console.log "$next_link href when >= poemUrls.length was set to #{$next_link.attr('href')}"
          console.log "The poemUrl when >= poemUrls.length is: #{poemUrls[index]}"
        else
          index += 1
          console.log "$next_link was clicked on!"
          $next_link.attr('href', poemUrls[index]).attr('href')
          console.log "$next_link href was set to #{$next_link.attr('href')}"
          console.log "The poemUrls when < poemUrls.length is: #{poemUrls[index]}"
          $('#main-poem').hide().fadeIn('slow')

$（文档）.ready->
$poem_years=$（“#ul li a年的诗歌”）
$poem=$（“#主诗”）.hide（）
$poem\u years.单击->
$poem.eq（0）.fadeIn（'slow'，->
$poem.slideDown（'slow'）
)
console.log“单击索引为#{$poem_years.index（@）}”的诗歌标题”
console.log“prevPoemUrl是：#{poemUrls[index]}”
如果索引
如果索引>=poemUrls.length-1
索引=0
$next_link.attr（'href'，poemUrls[index]）.attr（'href'）
$（'主诗'）.hide（）.fadeIn（'慢'）
console.log“$next_link href>=poemUrls.length设置为#{$next_link.attr（'href'）}”
console.log“当>=poemUrls.length为：#{poemUrls[index]}时的poemUrl”
其他的
指数+=1
console.log“$next_链接已单击！”
$next_link.attr（'href'，poemUrls[index]）.attr（'href'）
console.log“$next_link href被设置为#{$next_link.attr（'href'）}”
console.log“当
谢谢！这肯定解决了“在数组末尾单击两次”的问题，我检查了您的答案是否可以接受。关于此问题的第二部分有什么建议：如何将当前选定元素的引用传递到$next_链接。单击以使其知道当前选定的元素是什么，并可以获得正确的下一个元素，而不是从0? 换句话说，如果我点击年度诗篇中的第二首诗（id=17），我如何获得$next_链接。点击返回第三首诗（id=18），或者如果我点击上一个链接，获得$prev_链接。点击返回第一首诗（id=16）？既然所有条件逻辑都在[]之间以找到索引，它会这样实现吗
$next\u link=$（“#上一个下一个li a”）.last（）
$next\u link.click->'
nextPoemUrl=poemUrls[if index>=poemUrls.length-1然后0 else index+1]，
$next\u link.attr（'href'，nextPoemUrl.attr（'href'）
$prev\u link=$（'
$prev\u link.点击->'
prevPoemUrl=poemUrls[如果该评论删除了你的格式，但我觉得很好。如果它不能像你期望的那样工作，你能尝试一下并编辑你的问题吗？@antonparker，请查看上次编辑的最新内容。感谢你帮助这个人走得更远。没有你，你不可能做到这一点。
if index >= poemUrls.length - 1
    index = 0
...
if index <= 0
    index = poemUrls.length - 1

prevPoemUrl = poemUrls[ if index <= 0 then poemUrls.length - 1 else index - 1 ]
nextPoemUrl = poemUrls[ if index >= poemUrls.length - 1 then 0 else index + 1 ]

$(document).ready ->
    $poem_years = $('#poems-for-year ul li a')
    $poem = $('#main-poem').hide()
    $poem_years.click -> 
      $poem.eq(0).fadeIn('slow', -> 
        $poem.slideDown('slow')
      )
      console.log "Clicked on a poem title with index of #{$poem_years.index(@)}" # <-- where gets current index of clicked poem title!
      $poems_for_year_hrefs = $('#poems-for-year ul li a[href]')
      index = $poem_years.index(@) # <-- Assign the current reference to the index variable
      poemUrls = []
      $($poems_for_year_hrefs).each((i)->
        poemUrls[i] = $(@).attr('href')
        poemUrls.join(",")
      )

      console.log "The poemUrls array contains these: #{poemUrls}"

      $prev_link = $('#previous-next li a').first()
      $prev_link.click ->
       console.log "the prevPoemUrl is: #{poemUrls[index]}"
       if index <= 0
         index = poemUrls.length - 1
         $prev_link.attr('href', poemUrls[index]).attr('href')
         $('#main-poem').hide().fadeIn('slow')
         console.log "$prev_link href when <= poemUrls.length was set to #{$prev_link.attr('href')}"
         console.log "The poemUrls when <= poemUrls.length is: #{poemUrls[index]}"
       else
         index -= 1
         console.log "$prev_link was clicked on!"
         $prev_link.attr('href', poemUrls[index]).attr('href')
         $('#main-poem').hide().fadeIn('slow')
         console.log "$prev_link href was set to #{$prev_link.attr('href')}"   
         console.log "The poemUrls poemUrls.length is: #{poemUrls[index]}"

      $next_link = $('#previous-next li a').last()
      $next_link.click ->
        if index >= poemUrls.length - 1
          index = 0
          $next_link.attr('href', poemUrls[index]).attr('href')
          $('#main-poem').hide().fadeIn('slow')
          console.log "$next_link href when >= poemUrls.length was set to #{$next_link.attr('href')}"
          console.log "The poemUrl when >= poemUrls.length is: #{poemUrls[index]}"
        else
          index += 1
          console.log "$next_link was clicked on!"
          $next_link.attr('href', poemUrls[index]).attr('href')
          console.log "$next_link href was set to #{$next_link.attr('href')}"
          console.log "The poemUrls when < poemUrls.length is: #{poemUrls[index]}"
          $('#main-poem').hide().fadeIn('slow')