2

Nos meus experimentos com seletores jQuery me deparei com algo que não sei se é um erro meu ou é uma limitação natural do jQuery. Eu tenho 10 divs com as classes .dado. Cada uma, ao ser clicada, muda o evento onclick de uma outra (única), que tem o id #download. Apenas as 5 primeiras devem mudar o onclick da div #download. Tentei usar o seletor lt() para isso, mas vi que não rola. Todas as 10 divs recebem a função.

Como fiz:

$(document).ready(function(){
  $(".dado:lt(5)").click(function(){
    $("#download").attr("onclick", "href('http://meulink.com')");
  });
});

Ele realmente não consegue fazer isso, errei algo ou teria uma solução alternativa?

1
  • Não há nada de errado com seu script. Reveja a marcação HTML.
    – Maujor
    Commented 16/12/2018 às 11:25

2 Respostas 2

2

Como pode ver no exemplo, o método :lt() funciona perfeitamente para o propósito que quer aplicar:

$(function() {
  $(".dado:lt(5)").on("click", function() {
    $("#download").prop("href", "http://meulink.com");
    console.log($(this).text()+" - "+$("#download").prop("href"));
  });
});
.dado {
  cursor: pointer;
  padding: 5px;
  margin-bottom: 5px;
  background-color: #999;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="dado">DIV 01</div>
<div class="dado">DIV 02</div>
<div class="dado">DIV 03</div>
<div class="dado">DIV 04</div>
<div class="dado">DIV 05</div>
<div class="dado">DIV 06</div>
<div class="dado">DIV 07</div>
<div class="dado">DIV 08</div>
<div class="dado">DIV 09</div>
<div class="dado">DIV 10</div>
<a href="" id="download">DIV ÚNICA</a>

4
  • Ah, agora entendi meu erro! Eu me confundi por ver que clicando na div 6 adiante a div única ainda continuava a ser o mesmo link da 5, daí pensava que era porque elas também a alterava, mas é porque elas não tem nada a alterar para o link mudar... Commented 16/12/2018 às 13:08
  • Isso mesmo, exatamente. A partir da sexta os clicks não fazem mais nada.
    – LeAndrade
    Commented 16/12/2018 às 13:09
  • Uma dúvida que tenho é se é possível pegar divs do "meio", exemplo, quero da 3 a 6. Tem um seletor pra isso? Commented 16/12/2018 às 13:12
  • Cara para te falar a verdade, não conheço nenhum método ou seletor que possa pegar elementos com intervalos, acho que neste caso teria que fazer um for nos elementos mesmo.
    – LeAndrade
    Commented 16/12/2018 às 13:15
1

Use o método jQuery lt() combinado com o método gt().

No exemplo a seguir a função será executada para clicks nos div 03 a 06 inclusive (a contagem Javascript começa em ZERO).

É importante que os métodos sejam aplicados na ordem :lt():gt(). Se você inverter a ordem para gt(1):lt(6) a função será executada para clicks nos div 03 a 08 inclusive.

Isso não é um 🐛 "bug" 🐞 da jQuery. Você sabe o porquê?

$(".dado:lt(6):gt(1)" ).click(function(){
  //$("#download").attr("onclick", "href('http://meulink.com')");
  console.log($(this).html());
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>		
<div class="dado">DIV 01</div>
<div class="dado">DIV 02</div>
<div class="dado">DIV 03</div>
<div class="dado">DIV 04</div>
<div class="dado">DIV 05</div>
<div class="dado">DIV 06</div>
<div class="dado">DIV 07</div>
<div class="dado">DIV 08</div>
<div class="dado">DIV 09</div>
<div class="dado">DIV 10</div>
<a  onclick="" id="download">Link</a>

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 .