jQuery Frage

Question

Ich benutze jquery, so dass, wenn der Benutzer einen Link klickt, ich die ID des Links dann verwenden Sie es, um ein li-Element mit der gleichen ID zu wählen und zu animieren. Nun, zumindest das ist, was ich versuche zu tun ... so weit ich habe:

$(function(){ 
     $('#slider-buttons a').click(function(){ 
     var x = $(this).attr('id'); 
     var y = $('#slider-stage-list li' + x); 

     if(x == "inicio") 
      $(this).animate({ "left" : "0px"},700); 
     else 
      $(this).animate({ "left" : (increment*3) + "px"},700); 
    }); 
}); 

ich verschiedene Kombinationen ausprobiert habe, aber ich kann immer noch nicht bekommen ‚y‘ den Wert der Liste hat Artikel mit der gleichen ID wie x (der geklickt url) ... x hat bekommt die richtige id aber y gibt immer noch „unbestimmt“ bestenfalls ... hier ist der hTML-Code, der entlang geht ...

<div id="slider-buttons"> 
    <a href="#" id="inicio">Inicio</a> <br /> 
    <a href="#" id="previous">&iquest;Qui&eacute;nes Somos?</a> <br /> 
    <a href="#" id="clases">Clases</a> <br /> 
    <a href="#" id="equipo">Equipo</a> <br /> 
    <a href="#" id="album">&Aacute;lbum</a> <br /> 
    <a href="#" id="especiales">Eventos Especiales</a> <br /> 
    <a href="#" id="#">Cont&aacute;ctanos</a> <br /> 
</div> 
<div id="stage"> 
    <ul id="slider-stage-list"> 
     <li id="inicio">Inicio</li> 
     <li id="nos">&iquest;Qui&eacute;nes Somos?</li> 
     <li id="clases">Clases</li> 
     <li id="equipo">Equipo</li> 
     <li id="album">&Aacute;lbum</li> 
     <li id="especiales">Eventos Especiales</li> 
     <li id="#">Cont&aacute;ctanos</li> 
    </ul> 
</div> 

Irgendwelche Hilfe wird geschätzt =)

---

Bearbeiten, um die 3 Antworten zu beantworten

Wenn ich eine von denen mache, bekomme ich in console.log(); "[Object Object]" =/

---

bearbeiten Beantwortung BC

Danke für die HTML-Korrektur, immer noch, wenn ich den Code aufschreiben Sie gab mir für jquery ich in console.log immer noch (); "[Object Object]"

---

bearbeiten, weil ich nicht die letzte Antwort

bekam habe Wenn ich diesen Ansatz versuchen entweder ich "[object Object]" oder nichts ...

Answer 1

Nein, nein

Dies ist ungültig html, weil Ihre Links die gleichen Ids als Listenelemente teilen werden.

Der Code sollte mehr wie folgt aussehen:

<div id="slider-buttons"> 
    <a href="#" id="inicio">Inicio</a> <br /> 
    <a href="#" id="previous">&iquest;Qui&eacute;nes Somos?</a> <br /> 
    <a href="#" id="clases">Clases</a> <br /> 
    <a href="#" id="equipo">Equipo</a> <br /> 
    <a href="#" id="album">&Aacute;lbum</a> <br /> 
    <a href="#" id="especiales">Eventos Especiales</a> <br /> 
    <a href="#" id="contactanos">Cont&aacute;ctanos</a> <br /> 
</div> 
<div id="stage"> 
    <ul id="slider-stage-list"> 
     <li id="item_inicio">Inicio</li> 
     <li id="item_previous">&iquest;Qui&eacute;nes Somos?</li> 
     <li id="item_clases">Clases</li> 
     <li id="item_equipo">Equipo</li> 
     <li id="item_album">&Aacute;lbum</li> 
     <li id="item_especiales">Eventos Especiales</li> 
     <li id="item_contactanos">Cont&aacute;ctanos</li> 
    </ul> 
</div> 

und

$(function(){ 
     $('#slider-buttons a').click(function(){ 
     var x = $(this).attr('id'); 
     var y = $('li#item_' + x); 

     if(x == "inicio") 
       $(this).animate({ "left" : "0px"},700); 
     else 
       $(this).animate({ "left" : (increment*3) + "px"},700); 
    }); 
}); 

Answer 2

Sie vermissen ein Pfundzeichen, um den ID-Selektor zu verwenden, glaube ich. Versuchen Sie folgendes:

var x = $(this).attr('id'); 
    var y = $('#slider-stage-list li#' + x); // Note the 'li#' instead of just 'li'. 

Answer 3

var y = $('#slider-stage-list li' + x); 

sein sollte

var y = $('#slider-stage-list li#' + x); 
// or 
var y = $('#' + x); 
// or 
var y = $(this); 

Die dritte erwähnte Option ist wahrscheinlich am besten. Sie haben ein Problem: Ihre id sind nicht eindeutig. Das könnte das sein, wonach Sie suchen (ohne Änderungen an Ihrem HTML-Code):

var y = $('#slider-stage-list li').filter(function() { 
    return $(this).attr('id') == x; 
});