Bom dia a todos,
No meu ponto de vista o seletor mais confuso para se entender da biblioteca jQuery são os seletores por atributos múltiplos, logo porque na documentação de referência não tem muitos exemplos para “ilustrar” o modo de uso e também que não existem muitas pessoas que usam ele. É um seletor muito ágil, porque evita de você ter que implementar lógica com ifs e switchs no seu código Javascript para fazer alguma coisa, ou seja você dispara um seletor e faz alguma coisa, sem ter intermédios.
Vamos considerar que no nosso exemplos tenhamos um formulário com diversos inputs, selects, etc. e que este formulário tivesse o seu ID igual a ‘meu_form’. A jogada inicial de qualquer seletor transverso é assim:
[javascript]
var elementos = $(‘#meu_form’);
[/javascript]
Isso me trará apenas o meu formulário, no caso um Object (DOMObject) mascarado pela jQuery. Vamos começar a tunar esse seletor com mais algumas condições nele:
[javascript]
var elementos = $(‘#meu_form:input’);
[/javascript]
Agora tenho um array de Object com referência transparente à própria jQuery, ou seja, uma idéia de cross-access:
[javascript]
var elementos = $(‘#meu_form:input’).attr(‘style’, ‘border:1px solid red’);
[/javascript]
Consigo aplicar as modificações sem necessidade de invocar a função each em que eu faria a mesma coisa, só que dentro de um laço de repetição. Como no exemplo abaixo:
[javascript]
var elementos = $(‘#meu_form:input’).each(function(index, el) {
j(el).attr(‘style’, ‘border:1px solid red’);
});
[/javascript]
Vamos agora para o título deste artigo, os seletores múltiplos, caso eu queira deixar de fora um determinado input ou alguns inputs por exemplo, isso tudo no mesmo seletor, vamos montar a situação abaixo:
- nome;
- id_cidade;
- idade;
- telefone;
- celular;
- telefone_ramal;
- telefone_sala;
- telefone_cozinha;
Quero aplicar uma mascara nos campos de telefone com um seletor múltiplo:
[javascript]
var elementos = $(‘#meu_form:input[id=telefone],[id=celular]’).mask(’99/99/9999′);
[/javascript]
O conceito do ‘múltiplo’ nisso tudo está no formato dos filtros aplicados, posso atribuir qualquer coisa na regra o que tenho que fazer é separa-las por vírgula.
[javascript]
var elementos = $(‘#meu_form:input[id=telefone],[name^=telefone_]’).mask(’99/99/9999′);
[/javascript]
No exemplo acima, eu atríbui a mascara diretamente para o campo com ID ‘telefone’ e também para todos os que começassem com a palavra ‘telefone_’.
Referências
jQuery Selectors – http://api.jquery.com/category/selectors/
jQuery Multiple Attribute Selector – http://api.jquery.com/multiple-attribute-selector/
Espero que tenham entendido mais ou menos a idéia dos seletores múltiplos da jQuery, qualquer coisa utilizem a área de comentários abaixo.
Abraços.