eventos de corte e clique do jQuery

Question

Esta é provavelmente uma pergunta muito simples sobre jQuery, mas não consegui respondê-la depois de 10 minutos na documentação, então ...

Eu tenho uma lista de caixas de seleção e posso obtê-las com o seletor 'input[type=checkbox]'.Quero que o usuário possa clicar com a tecla Shift pressionada e selecionar uma série de caixas de seleção.Para fazer isso, preciso obter o índice de uma caixa de seleção na lista, para poder passar esse índice para .slice(start, end).Como obtenho o índice quando o usuário clica em uma caixa?

Answer 1

O seguinte seletor também deve funcionar em jQuery: input:checkbox.

Você pode então encadear o :gt(index) e :lt(index) filtros juntos, então se você quiser as caixas de seleção da 5ª à 7ª, você usaria input:checkbox:gt(4):lt(2).

Para obter o índice da caixa de seleção atualmente clicada, basta usar $("input:checkbox").index($(this)).

Answer 2

Esta é uma solução rápida, mas eu daria a cada caixa de seleção um ID exclusivo, talvez com uma dica de índice, assim:

<input id="checkbox-0" type="checkbox" />
<input id="checkbox-1" type="checkbox" />
<input id="checkbox-2" type="checkbox" />
<input id="checkbox-3" type="checkbox" />
<input id="checkbox-4" type="checkbox" />

Você pode então obter facilmente o índice:

$(document).ready(function() {
  $("input:checkbox").click(function() {
    index = /checkbox-(\d+)/.exec(this.id)[1];
    alert(index);
  });
});

Answer 3

Obrigado pela resposta, Samjudson.

Depois de mais experiências, descobri que você pode usar apenas $(':checkbox') para selecioná-los.É interessante que você possa usar o .slice() função para obter o intervalo, mas você também tem a opção de fazê-lo no seletor com :gt e :lt.Eu acho a sintaxe de .slice() ser mais limpo do que usar os filtros seletores.

Devo dizer que não gosto muito da solução de Ryan Duffield, porque ela requer alterações na marcação e envolve a repetição de código.

Answer 4

@Gorgapor:Acho que às vezes preciso responder às perguntas um pouco menos literalmente.:-) Achei que você estava obrigado a exigir algum tipo de índice.Acho que você descobrirá que, à medida que usa mais o jQuery, geralmente não precisa fazer esse tipo de coisa.