Ik heb momenteel al een klein stukje code geschreven.

De bedoeling is dat je door middel van het linker- en rechterpijltje door de knoppen kan lopen.
Bijkomend kan je door te klikken ook van daar beginnen ipv het begin, maar dit wil maar niet lukken.

Het gewoon doorlopen lukt al, maar ik wil dat de knop 'NOT' niet meegenomen wordt.
Dit is nu al deels het geval (hij verkleurt niet, maar ik wil dat hij er ineens overspringt).
Bij de pijltjestoetsen moet hij dus van 1 ineens naar 2 springen.
Het gedeelte met het beginnen vanaf de geklikte knop lukt nog niet.

Kan iemand mij hierbij helpen?
http://jsbin.com/agufem/2/edit

Thomas

Met deze code werkt het, je moet alleen wel even de onclick="" uit je html halen.

PHP Code:

$(document).ready(function(){
  var buttons = jQuery('.game-moves').find('.moves');
  var selected = buttons.first();
  buttons.first().addClass('selected');
  
  $(window).keydown(function(e){
    if(e.which === 39){
      if(selected.next().length>0){
        while(!selected.next('button').hasClass('moves'))
        {
          selected = selected.next();
        }
      selected = selected.next();
      }
    }else if(e.which === 37){
     if(selected.prev().length>0){
        while(!selected.prev('button').hasClass('moves'))
        {
          selected = selected.prev();
        }
      selected = selected.prev();
    }
    }
    selected.trigger("click");
  }
  );
  
  $('.moves').click(function(){
    $('.game-moves .selected').removeClass('selected');
    $(this).addClass('selected');
    alert($(this).text());
    selected = $(this);
  });
}); 


Met vriendelijke groet,
Tim Colla

Bedankt.
Dit helpt mij al een heel eind verder.
Nu zit ik nog met het volgend probleem.

Stel ik heb 2 lijsten met knoppen. Hier wil ik beide de functionaliteit van de pijltjes/klik hebben. Dit stuk is al gelukt.
Nu als je op een knop zou klikken van een subdiv, dan zou deze functionaliteit van de pijltjes hierin moeten werken. Stel ik klik op 2 van een subdiv, dan wil ik dat van de class game-moves de enige geselecteerde knop nr 2 is en dat ik met de pijltjes naar 1 en 3 kan gaan.

Hier kom ik niet echt uit.
Mijn laatste script vind je hier.
http://jsbin.com/agufem/20/edit

Alvast bedankt.

Met deze javascript werkt het:
Ik heb de alert() even als commentaar staan.

PHP Code:

$(document).ready(function(){
  
  $(window).keydown(function(e){
    if(e.which === 39){
      if(selected.next().length>0){
        while(!selected.next('button').hasClass('moves'))
        {
          selected = selected.next();
        }
      selected = selected.next();
      }
    }else if(e.which === 37){
     if(selected.prev().length>0){
        while(!selected.prev('button').hasClass('moves'))
        {
          selected = selected.prev();
        }
      selected = selected.prev();
    }
    }
    selected.trigger("click");
  }
  );

    $('.game-moves').click(function(){
    $('.active').removeClass('active');
    $(this).addClass('active');
    selected = $('.selected',this);
    if(selected.length<1){
      selected = $('.active button').eq(0);
    }
  });
  
  
  $('.moves').click(function(){
    if(!$(this).parents('.active')){
      $('.active').removeClass('active');
      $(this).parents('.game-moves').addClass('active');
    }
    $('.active').find('.selected').removeClass('selected');
    $(this).addClass('selected'); 
   // alert($(this).text());
    selected = $(this);
  });
  

});