Conocer índice de elemento con padre variable

[Froscas]

Muy buenas, es mi primera consulta y la verdad es que me estoy volviendo loco; he encontrado soluciones aproximadas a lo que necesito pero no acabo de dar con la tecla.

Lo que quiero averiguar es el índice del enlace sobre el que se hace click; consigo hacerlo si referencio a la clase o la id del div padre, pero este div puede variar y no soy capaz de acceder al padre con una variable:

el menú sería el siguiente:

Código HTML:

<div id="menu" class= "menuprincipal">
    <ul">
      <li><a href="#">Uno</a></li>
      <li><a href="#>Dos</a></li>
      <li><a href="#">Tres</a></li>
      <li><a href="#">Cuatro</a></li>
    </ul>
</div>
 

y el selector que me funciona lo tengo así

Código Javascript:

$('.menuprincipal a').click(function(){
    var EnlacePinchado=$('#menu a').index(this);
});
 

bien, el caso es que tengo otros menus de la misma clase, por lo que necesito acceder al padre de "this" que será distinto dependiendo del menú elegido, es decir, no me vale $('.menuprincipal a').index(this) porque lo que quiero saber es el indice del enlace pinchado dentro de cada menú.

He utilizado todas las combinaciones de parent() y children() que se me han ocurrido pero no tengo huevos de conseguir algo así como

Código Javascript:

var EnlacePinchado=$('MENU_PADRE_DEL_ENLACE_PINCHADO a').index(this)
 

que es lo que me haría el apaño.

¿Alguna idea?

[Franz1628]

si utilizas http://api.jquery.com/parent/

[Froscas]

Si bueno, ya te comento que es por ahí por donde estoy investigando, pero no soy capaz de capturar una referencia a un objeto con parent, es decir

Código Javascript:

var menu = $(this).parent().parent().parent() // accedo al "div" pasando por "li" y "ul"
alert(menu.id);
 

no me devuelve la id del menu, con lo que asumo que no puedo meter en una variable una referencia a un elemento al que he llegado con parent(). Aparte de que tengo que ser capaz de hacer una colección de enlaces (a) después de llegar al padre y pillarlos con un selector.

Lo máximo que he conseguido desde esta mañana es lo siguiente (agárrate):

Código Javascript:

$('.menuprincipal a').click(function(){
    var id_div=$(this).parent("li").parent("ul").parent("div").attr("id");
    var menudemarras="#"+ id_div +" a"; //chúpate esa
    var indice=$(menudemarras).index(this);
    alert(indice);
});
 

que, contra todo pronóstico, funciona y hace lo que quiero.

Pero no deja de ser una cosa horrenda y horrible, ¿no hay ninguna manera elegante de conseguir usar parent() e index()?

[Franz1628]

utiliza entonces parents http://api.jquery.com/parents/

Código Javascript:

var id_div=$(this).parents("div").attr("id")
 

un Ejemplo

Código HTML:

<script type="text/javascript" src="jquery.js" ></script>
<script>
$(document).ready(function(){
    $('#a').click(function(){
        $(this).parents('div').css('display','none');
    })
})
</script>
 
<div id="hola">
<span>
    <a id="a" href="#">enlace</a>
    <input id="b" type="button" value="ff">
</span>
</div>
 

[Froscas]

Gracias por tu sugerencia, así me ahorro un par de parents; pero no puedo usar index igual que tú usas css en tu ejemplo.

Creo que mi pregunta no tiene respuesta porque no sé si hay alguna manera de pasarle al selector jQuery una referencia al elemento "div" y además a la colección de enlaces que tiene debajo para que index funcione (que es en realidad lo que me interesa) y me diga qué anchor es el que pinché.

Mi pregunta debió ser más amplia: ¿hay alguna manera de pasar una variable a un selector? Es decir, yo sé seleccionar $("div ul li a"), pero cómo hago para seleccionar un enlace fulanito de una lista tal de un div cual $("div_variable ul li a_variable")

Aunque mi ejemplo sea chapucero, quizá la única manera sea escribirlo en plan

Código Javascript:

var selector_jquery = "#" + div_id + " ul li " + "# " + a_id ;
$(selector_jquery).hazalgo
 

con lo que a fin de cuentas la cosa funciona aunque me haga daño a la vista.

Un saludo y gracias.

[Froscas]

Bueno, he encontrado otro método (lo llamaremos "ascensor") que me parece más elegante; seguro que hay otra manera pero

Código Javascript:

$('.menuprincipal a').click(function(){
var indice=$(this).parents('.menuprincipal').children().children().children().index(this);
});
 

funciona perfectamente. No he dado antes con esto porque parece ser que "children" no trabaja igual que "parents", sino que sólo busca el nivel justo por debajo, con lo que hay que saber cuantos elementos tenemos entre el enlace y el menu (en este caso 3); ¡pero ya sólo ocupo una línea! con lo cual me quedo satisfecho.

Gracias de nuevo!