7

Estando aqui fazendo os meus sites em php/mysql/html/css e aprendendo cada vez mais sobre jQuery me peguei na situação em que eu deveria usar um mesmo código para duas ids distintas.

Como proceder ao precisar usar o mesmo código em dois lugares diferentes para executar o mesmo script que nesse caso é abrir e fechar um slideToggle em um formulário de topo? Pelo que sei o jQuery dá pau quando duplicamos uma id na mesma página até porque por lógica, id é identidade, é única.

jQuery(function(){

    jQuery("#botaodeacao").click(function(e) {  
        jQuery("#oformulario").slideToggle(1500);
    });

    jQuery("#botaodeacao2").click(function(e) {
        jQuery("#oformulario").slideToggle(1500);   
    }); 
    e.preventDefault();             
});

Tudo bem, podemos fazer por classes mas e se precisar fazer com ids ...

3 Respostas 3

6

Separe os seletores com virgula:

jQuery(function(){

    jQuery("#botaodeacao, #botaodeacao2").click(function(e) {  
        jQuery("#oformulario").slideToggle(1500);
    });

});

Na verdade o seletor jquery funciona exatamente da mesma forma de um seletor CSS, e tem mais algumas funcionalidades exclusivas.

http://api.jquery.com/multiple-selector/

http://api.jquery.com/?s=selector

1
  • 1
    obrigado @jader. O pessoal desse portal realmente é um povo especial. Esta é uma ótima informação saber que ps seletores funcionam da mesma forma pois sou ótimo em CSS, ficará mais fácil o aprendizado. Commented 9/08/2014 às 18:14
6

Para esse fim existe o conceito de classes, que diferente dos ids, podem ser usados em mais de um elemento:

HTML:

<div class="minha-classe">Uma div</div>
<div class="minha-classe">Outra div</div>

Javascript:

// as classes são referenciadas com um "." (ponto)
// ao invés do "#" que são para os ids
$(".minha-classe").façaAlgo(...);

No código acima, o método façaAlgo será executados para todos os elementos que possuem a classe minha-classe.

2

Deixo mais uma resposta com uma abordagem nao mencionada nas outras respostas.

Acho porém que usar classes (como o Andrey sugeriu) para agrupar elementos é melhor solucao e mais flexivel/expansivel do que indicar elementos 1 a 1.

Seguindo a ideia de agrupar os elementos pode usar pseudo-seletores como ^=nome, ou seja que procuram elementos cujo id (ou classe, nome, etc) comecam com aquela string. Assim, neste caso:

jQuery("[id^=botaodeacao]").click(function(e) {  
    jQuery("#oformulario").slideToggle(1500);
});

Este seletor vai buscar todos os elementos cuja id comece com botaodeacao independentemente de quantos houver. Alguns exemplos seriam: "botaodeacao", "botaodeacao2", "botaodeacao_45", etc

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 .