9

Por exemplo:

<div class="container">
  <div class="position"></div> <!-- Essa tinha que ser position [0]-->
  <div class="position"></div> <!-- Essa tinha que ser position [1]-->
  <div class="other"></div>
  <div class="position"></div> <!-- Essa tinha que ser position [2]-->
  <div class="position"></div> <!-- Essa tinha que ser position [3]-->
  <div class="other"></div>
  <div class="position"></div> <!-- Essa tinha que ser position [4]-->
  <div class="other"></div>
  <div class="other"></div>
</div>

Isso feito de preferencia com Jquery.

É possível?

0

3 Respostas 3

5

Pode usar assim:

var divs = $('.container .position');
divs.each(function (i) {
    this.setAttribute('data-index', i);
});
divs.on('click', function () {
    console.log($(this).data('index'));
});

Exemplo

No caso de querer saber qual é a ultima div pode usar assim


Existe outra variante:

var divs = $('.container .position');
divs.on('click', function () {
   var pos = (divs.get()).indexOf(this);
   // ou, à la Zuulvaretto:
   // var pos = Array.prototype.indexOf.call(divs, this);
    console.log(pos);
});

Exemplo

7
  • Sergio, tem como adicionar por exemplo um .css() atravez de seu index. Assim, quero adicionar um background onde o index é 4.. tipo $(".position").index(4).css("background", "red"), tipo manipular pelo seu index() Commented 20/02/2014 às 20:27
  • 2
    Um refactoring à la Zuul pra você: jsfiddle.net/LsD7k/1
    – bfavaretto
    Commented 20/02/2014 às 21:12
  • 1
    Hahaha :) gostei do " à la Zuul" @bfavaretto
    – Sergio
    Commented 20/02/2014 às 21:14
  • 2
    Hahahaha, Zuulvaretto :)
    – bfavaretto
    Commented 20/02/2014 às 21:16
  • 1
    Opa.. Isso mesmo.. deu certinho! Obrigadissimo! Commented 20/02/2014 às 21:16
2

Você pode selecionar os elementos via jQuery. O array estará na ordem que estes aparecem no DOM.

$(".position").each(function(index, el) {
    $(this).text("Pos: " + index);
});

Fiddle

3
  • Entendi! Obrigado. Commented 20/02/2014 às 19:27
  • Ok, amigo.. e fazendo isso com click? Exemplo: jsfiddle.net/27Rg7/1 Ao clicar no primeiro ele mostra a posição dele e assim por diante. Ao chegar no ultimo imprimir "Eu sou o ultimo". Esse exemplo esta assim: ao clicar no primeiro ele mostra de todos, queria que mostrasse so a posição dele. Commented 20/02/2014 às 19:50
  • 1
    @JeffersonAlison Eu faria assim Commented 21/02/2014 às 10:35
0

Você pode utilizar a função index() do jQuery, funcionando da seguinte forma, no seu caso vou exemplificar com um evento de clique:

$('.position').click(function(){
  alert($(this).index());
}); 
5
  • $(this).index() vai dar o index relativo a todas as divs, incluíndo .other. Dê uma olhada na 4a div aqui.
    – Sergio
    Commented 20/02/2014 às 20:25
  • Tava aqui me perguntando: quando será que o Sergio vai aparecer pra falar que tá errado? hahaha, brincadeira. (mas eu sabia que tava porém confesso que fiquei com preguiça rs) Commented 20/02/2014 às 20:41
  • haha :) apanhei por acaso, fui saír e estava a dar uma olhada às perguntas que tinha "perdido"
    – Sergio
    Commented 20/02/2014 às 20:46
  • pois então, eu tava pensando em pegar o index com o clique mas não consegui pensar em uma coisa que funcionasse certinho. Commented 20/02/2014 às 20:47
  • Veio-me agora à cabeça uma alternativa: ($('.position').get()).indexOf(this);
    – Sergio
    Commented 20/02/2014 às 20:52

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .