teclado Enlazar a la izquierda/derecha de navegación

Question

Soy un fotógrafo y tienen un sitio web donde no soy capaz de editar la estructura de 'plantilla' pero puedo subir javascript/css etc.

quiero unir al lado de navegación/PREV para teclado derecha/izquierda.

La estructura de los enlaces son:

<div class="image_navigation"> 
     <h4>Image Navigation</h4> 
     <ul> 
     <li class="index"><a href="LINKURL">Index</a></li> 
     <li class="previous"><a href="LINKURL">Previous</a></li> 
     <li class="next"><a href="LINKURL">Next</a></li> 
     </ul> 
    </div> 

que se refiere a this y lograron crear esto.

$(function() {$(document).keyup(function(e) { 
switch(e.keyCode) { case 37 : window.location = $('li.prev').attr('href'); break; 
    case 39 : window.location = $('li.next').attr('href'); break; }});}); 

Aquí es donde estoy atascado. No funciona porque supone que estoy refiriéndome a una etiqueta href pero me estoy refiriendo al li que la contiene.

¡Cualquier idea sería muy apreciada!

Answer 1

window.location = $('li.next a').attr('href'); 

Answer 2

$(function() {$(document).keyup(function(e) { 
switch(e.keyCode) { case 37 : window.location = $('li.prev a').attr('href'); break; 
case 39 : window.location = $('li.next a').attr('href'); break; }});}); 

$ ('li.next') se dirige a todos los elementos de la lista con la clase de 'siguiente', y eso es todo - es inconsciente del contenido del elemento de la lista.

Si desea el href de la etiqueta a, tiene que ir un poco más profundo ($ ('li.next a') o $ (li.next '). Find (' a ')) - su original el código estaba buscando el atributo href del elemento de la lista en sí (que, por supuesto, no existe, ya que los elementos de la lista no tienen atributos href).

Answer 3

Debe dirigirse al < a> dentro del < li>. Veo que está usando jquery [y asume que ha incluido el archivo jquery necesario en el encabezado].

http://api.jquery.com/child-selector/ es un buen lugar para aprender acerca de los selectores de jquery.

Suponiendo que todo lo demás en su código es correcto se puede lograr lo que creo que está buscando con

$(function() { 
    $(document).keyup(function(e) { 
     switch(e.keyCode) { 
      case 37 : window.location = $('li.previous a').attr('href'); 
       break; 
      case 39 : window.location = $('li.next a').attr('href'); 
       break; 
     } 
    }); 
}); 

Answer 4

me encontré con esta pregunta en la búsqueda de duplicados en this question y decidí compartir el poco de jQuery escribí a contestar que uno modificado para sus selectores:

// when the document is ready, run this function 
jQuery(function($) { 
    var keymap = {}; 

    // LEFT 
    keymap[ 37 ] = "li.prev a"; 
    // RIGHT 
    keymap[ 39 ] = "li.next a"; 

    $(document).on("keyup", function(event) { 
     var href, 
      selector = keymap[ event.which ]; 
     // if the key pressed was in our map, check for the href 
     if (selector) { 
      href = $(selector).attr("href"); 
      if (href) { 
       // navigate where the link points 
       window.location = href; 
      } 
     } 
    }); 
});